SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    Jun 2004
    Location
    boston, ma
    Posts
    149
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Slimbox2: moving the close, next and previous buttons

    Slimbox2 is a lightbox that works in IE6 quirks mode. I work on a corporate intranet that is set in this crazy mode. Because the page is behind a corporate firewall, I can not give you a URL.

    I would like to have all of the buttons in the footer so that they are visible at all times. The desired order Close [white space] Previous Next. If the caption needs space, then having the Previous and Next buttons above the Close button would also work.

    I know that this will require CSS modification. So I would appreciate the code for doing this or if you have done this on your site, a URL would be appreciated. I tried modifying the CSS and got the buttons in the horizontal position but not vertical.

    Will moving the buttons require changing the javascript? If yes, please be gentle. I am working on my fear of javascript, so clear modified code would be appreciated.

    Thanks folks.

    VRM

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,297
    Mentioned
    460 Post(s)
    Tagged
    8 Thread(s)
    It would be easy to make the links always visible, and to place them down in the bottom right and left corners of the images. You change this:

    Code:
    #lbPrevLink {
    	left: 0;
    }
    
    #lbPrevLink:hover {
    	background: transparent url(../img/prevlabel.gif) no-repeat 0 15%;
    }
    
    #lbNextLink {
    	right: 0;
    }
    
    #lbNextLink:hover {
    	background: transparent url(../img/nextlabel.gif) no-repeat 100% 15%;
    }
    to this:

    Code:
    #lbPrevLink, #lbPrevLink:hover {
    	left: 0;
    	background: transparent url(../img/prevlabel.gif) no-repeat 0 100%;
    }
    
    
    #lbNextLink, #lbNextLink:hover {
    	right: 0;
    	background: transparent url(../img/nextlabel.gif) no-repeat 100% 100%;
    }
    To move those links into the footer is a little harder.

  3. #3
    SitePoint Zealot
    Join Date
    Jun 2004
    Location
    boston, ma
    Posts
    149
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ralph thanks for the code. I will implement when I get to work tomorrow.

    VRM

  4. #4
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    I'd just pitch the lightbox crap in the trash -- but then I HATE LIGHTBOX -- PASSIONATELY. Much like when someone sends me a digg link and I respond "FOR **** SAKE JUST SEND ME THE DAMNED ARTICLE LINK" I respond to lightbox with "OH FOR **** SAKE JUST LET ME OPEN THE **** IMAGE"

    I'd rather have a image open NOW instead of after some goof assed animation plays, especially when it screws up browser zoom, often screws up the ability to scroll if the image is larger than the page, etc, etc, etc... Especially since versions like the one you are looking at are burdened with that fat bloated jquery bull.

    /FAIL//FAIL//FAIL//FAIL//FAIL/

    Maybe that's just me.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •