0

I'd like to apply a global site-wide little javascript window on the very bottom right of the site that will display a window about 40 x 80 wide, just a book icon and the word "Bible", where when a person clicks it, it will open a pop-up window, centered and pull whatever page I give it to display the bible itself (I have it internally already). These little javascript windows auto scroll as you scroll up or down the pages, you've seen them many times.

PS: I also want a "hide" option, but it doesn't hide it but minimizes it down to a small icon, all the way to the very bottom right of the site. So, click it opens, click it minimizes. Example is my right side column at www.talkjesus.com home page.

Problem is, I don't know the name of this type of script :)

Your help appreciated. Thanks.

4
Contributors
5
Replies
6
Views
5 Years
Discussion Span
Last Post by JJenZz
0

Ok, I'm familiar with jQuery yes just not a coder or programmer off hand.

Let me see if I can reword this:

Its like an overlay little object (image for example) that stays static in that bottom right section position and automatically scrolls as you scroll up or down a page, hence being static put and 'overlay'.

0

Ok this is somewhat what I'm looking for

http://www.lab.mattvarone.com/projects/jquery/totop/
(scroll down)

I want the 'modal' style static overlay box to be like that, but when you click it it opens up a centered window or 'modal' box where it will display the bible (I have js code). I also want hide option so that the little right corned window with icon and "bible" text can be hidden and shown manually.

**In essence, its like those static side tabs you see often on sites, such as my own left side at www.talkjesus.com
**
Perhaps that tab style would be best for me, on right side. If someone can explain how I can replicate those tabs but right side that would be great. That's a 3rd party free service so I don't know how to go about replicating it (using one tab, right sided and custom image), making it open a centered window of my chosen size and internal content.

Edited by LogicWeb

0

HTML:

<span id="bible-modal-trigger">Bible</span>

CSS

#bible-modal-trigger {
    background: url(http://tinyurl.com/cawz2y3) no-repeat;
    position: fixed;
    right: 10px;
    bottom: 10px;
    width: 60px;
    padding-top: 65px;
    text-align: center;
    cursor: pointer;
}

Obviously change the background image to match yours and adjust the dimensions in the CSS. Then you just need to hook on some lightbox JS to do the overlay you mentioned. There are plenty of plugins and tutorials available on that topic.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.