Page 1 of 4 123 ... LastLast
Results 1 to 10 of 35

Thread: Lightbox (I think)

  1. #1
    Join Date
    Dec 2006
    Location
    South Africa
    Posts
    78
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Default Lightbox (I think)

    Is there a script here that does the cute image display of darkening the main screen and opening a box in the foreground

    See it work here and click on the motherboard thumbnail.

    I've seen various iterations of this and the one that seems logical from the page source is missing the "close button" and of course the .js file is password protected.

    From the page source it looks like it calls up jquery-1.2.6.min.js and there are downloads of this available but I did not find a page for dummies like me to demonstrate how it works and to use it in a web page.

    I also searched the forums and all took me to "scripts" I have already employed.

  2. #2
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

  3. The Following User Says Thank You to bluewalrus For This Useful Post:

    Bernie Kruger (11-27-2009)

  4. #3
    Join Date
    Dec 2006
    Location
    South Africa
    Posts
    78
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Default

    Thanx

    Hopefully I do not screw it up too much

  5. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,373
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    That particular script is:

    http://leandrovieira.com/projects/jquery/lightbox/

    However, if you want to use the original lightbox, use the latest version:

    http://home.comcast.net/~jscheuer1/side/lightbox2.04a/

    which was introduced here:

    http://www.dynamicdrive.com/forums/s...470#post163470

    There are tons of lightbox type scripts around though. So the real deciding factors are compatibility with the rest of your code, especially other scripts (if any), and the particular features you require.

    To find a large amount of lightbox type scripts, Google:

    lightbox

    and also:

    lightbox clones
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #5
    Join Date
    Dec 2006
    Location
    South Africa
    Posts
    78
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Default

    I already have a conflict

    Code:
    <link rel="stylesheet" type="text/css" href="../Renovate/scripts/mmenu.css">
    and

    Code:
    <link rel="stylesheet" href="../scripts/Lightbox/css/lightbox.css" type="text/css" media="screen" />
    How does one do a workaround? The tutorial suggests merging css docs but that sounds like a long winded approach.

    If the lightbox refs are before the omni menu, the menu does not work and if the lightbox refs are after the omnimenu, the lightbox script does not work. I just noticed the slideshow also is affected - Just my luck

    I tried changing to rel1=... but it seems "rel" is a relevant syntax no pun intended.

    Any quick work-arounds?

    I have declared the full reference to lightbox like this

    Code:
    <script type="text/javascript">
    //script for lightbox</script>
    	<link rel="stylesheet" href="../scripts/Lightbox/css/lightbox.css" type="text/css" media="screen" />
    	
    	<script src="../scripts/Lightbox/js/prototype.js" ></script>
    	<script src="../scripts/Lightbox/js/scriptaculous.js?load=effects,builder"</script> 
    	<script src="../scripts/Lightbox/js/lightbox.js" ></script>
    
    	<style type="text/css">
    		body{ color: #333; font: 13px 'Lucida Grande', Verdana, sans-serif;	}
    	</style>
    From the demo, he had the references like this

    Code:
    	<link rel="stylesheet" href="../scripts/Lightbox/css/lightbox.css" type="text/css" media="screen" />
    	
    	<script src="../scripts/Lightbox/js/prototype.js" type="text/javascript"></script>
    	<script src="../scripts/Lightbox/js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
    	<script src="../scripts/Lightbox/js/lightbox.js" type="text/javascript"></script>
    
    	<style type="text/css">
    		body{ color: #333; font: 13px 'Lucida Grande', Verdana, sans-serif;	}
    	</style>
    And that does not work if pasted as is into my page. The way I have declared it, got the lightbox to work as my images are embedded in <td tags

    I did all the markups on the css as suggested by the author for the image button links but I want to use this script in the future so I have assigned it a folder of lightbox as a sub folder of scripts.

    The omnimenu stuff is in another folder called renovate/scripts

    In the preview of FP editor, I get an error of
    Line:188
    Char:3
    Error:'null' is null or is not an object

    Not that that tells me much anyway

    I have only experimented with one image so I have not screwed up too much (yet)

  7. #6
    Join Date
    Dec 2006
    Location
    South Africa
    Posts
    78
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Default

    Sorry John, did not see your post, was editing this one
    Busy working on the "solution"
    Still I am learning

  8. #7
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,373
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    A page may have more than one external stylesheet. As long as the styles in them do not conflict in such a way as to have an adverse impact upon the intended presentational style of the markup, there will be no problem. If that does happen, the styles that do conflict may be made more specific so that they do not. This is all but meaningless:

    Code:
    <script type="text/javascript">
    //script for lightbox</script>
    It is a script with only a comment in it. It doesn't do anything as either a script or as an HTML element other than add to the DOM's script's element collection, which is just a collection of all the script tags in the document, used only if one is counting them off for some purpose.

    I'm not sure what the problems you are having are really attributable to. I would have to see a live demo of the page:

    Please post a link to the page on your site that contains the problematic code so we can check it out.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  9. #8
    Join Date
    Dec 2006
    Location
    South Africa
    Posts
    78
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Default

    John

    The updated version does not kill the omnimenu, (top) but it hides it away from view (depends where the reference script is placed). I think that is fixed, but the menu tab thickness seems to have been affected I am sure I can fix that

    The slideshow I am running is just a black box

    I published the one page with the scripts to www.lbk.co.za/const/renovate/AC4Light.htm

    It will cycle between the 4 pages from the top menu but you will need to call this link manually to go back to the temp page.

    In the frames page version the lightbox does not work but as solo pages, it does. That is the 1st bug

    The second bug is the "conflict" with the Simple Controls Gallery

    BTW only the 1st image "Cherry has been updated with lightbox, the rest were on the popup which I have removed but is still up on the current AC4 page

    From the main page I inserted a link to the test page but is white, it is centered with a screen tip, sure you'll know how to find that You can then see what the effects are from the split frames. link

    Once upon a time I did try out your frames template but I think I am too doff to make that work so I am stuck with the crappy MS one for now

    Rgds

  10. #9
    Join Date
    Dec 2006
    Location
    South Africa
    Posts
    78
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Default

    As for the meaningless script, that will go - not quite sure how to insert comments in the html code like the old rem statements That was just for me to track, where I am putting the scrips as the FP editor has the uncanny ability to lose its focus from where you just were and goes all by itself to the end of head section, I still need a WYSIWYG, bad habits die hard I guess.

  11. #10
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,373
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    I'm not sure what to click on for the lightbox. Use this version of the simple controls gallery script to (hopefully) avoid conflict:

    Attachment 3037
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

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
  •