Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder
    Join Date
    Oct 2010
    Posts
    133
    Thanks
    28
    Thanked 0 Times in 0 Posts

    Jquery Lightbox help

    OK, so I'm wanting to set up a lightbox on my company's website. We use a CMS system call phpWebsite. So I place the following script...

    Code:
    <script type="text/javascript" src="/jquery.mousewheel-3.0.4.pack.js"></script>
    
    	<script type="text/javascript" src="/jquery.fancybox-1.3.4.pack.js"></script>
    	<link rel="stylesheet" type="text/css" href="/jquery.fancybox-1.3.4.css" media="screen" />
    <script type = "text/javascript">
    function setCookie(isName,isVal) {
        document.cookie = isName + "=" + isVal + ";expires="  + "path=/";
    }
    
    function getCookie(isName){
        cookieStr = document.cookie;
        startSlice = cookieStr.indexOf(isName+"=");
        if (startSlice == -1) {return null;}
        endSlice = cookieStr.indexOf(";",startSlice+1);
        if (endSlice == -1){endSlice = cookieStr.length}
        isData = cookieStr.substring(startSlice,endSlice)
        isValue = isData.substring(isData.indexOf("=")+1,isData.length);
        return isValue;
    }
    
    $(document).ready(function() {
        if ( getCookie('myCookie') != null ) return; // no light box!
        setCookie('myCookie', 'ANY VALUE'); // for next time
        $("a#onload").fancybox({
    		'frameHeight':	390,
    		'frameWidth':	640,
    		'hideOnContentClick': false,
    		'easingIn': 2000
    			}).trigger('click'); 
    		});
    </script>
    	
     <div style="display: none;" id="lightbox_content">
     <div id="data"><img alt="lightbox (188K)" src="./images/filecabinet/folder50/lightbox.jpg" height="330" width="650" border="0"/>
     </a>
         </div>
    	</div>
    
         <p>   <a id="onload" href="#data"> </a></p>
    So I save my page, but when I go to the page it brings up that page in the lightbox instead of the image.....

    So I look at the source and it's changing the last line to this:

    Code:
      <p>   <a id="onload" href="index.php?module=article&id=206#data"> </a></p>
    I've tried this multiple times and it keeps doing it. Is there another way to write the last line? I willing to try anything right now.

  2. #2
    GŁtkodierer
    Join Date
    Apr 2009
    Posts
    2,127
    Thanks
    1
    Thanked 426 Times in 424 Posts
    Quote Originally Posted by javanewbie7 View Post
    So I look at the source and it's changing the last line to this:
    What's "it"? The CMS? Then this is not a Javascript question at all.
    At the page you linked to in the other thread, there's no element with the id "onload" at all, so I don't really know what's supposed to be the problem.

    Also, I see that you have been advised in your other thread to ask a mod to move it; instead you chose to crosspost. Please don't do that.

  3. #3
    Regular Coder
    Join Date
    Oct 2010
    Posts
    133
    Thanks
    28
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by venegal View Post
    What's "it"? The CMS? Then this is not a Javascript question at all.
    At the page you linked to in the other thread, there's no element with the id "onload" at all, so I don't really know what's supposed to be the problem.

    Also, I see that you have been advised in your other thread to ask a mod to move it; instead you chose to crosspost. Please don't do that.
    Yeah the CMS is changing it. I was hoping there could be a different way to get the script to pull #data.

    I was in the process of trying of a couple of things with the script. It's back up now if you need to see it. Thanks.....
    link

  4. #4
    GŁtkodierer
    Join Date
    Apr 2009
    Posts
    2,127
    Thanks
    1
    Thanked 426 Times in 424 Posts
    Well, if you want
    Code:
    <a id="onload" href="index.php?module=article&id=206#data"> </a>
    to really be
    Code:
    <a id="onload" href="#data"> </a>
    you can easily do something like
    Code:
    $('a#onload').attr({href: '#' + $('a#onload').attr('href').split('#')[1]});
    before you call .fancybox() on that link.

    That would probably fix it, but basically it means that you're doing things wrong. If you want your HTML to look a certain way, you have to make sure that your CMS builds it that way, and not try to fix wrong CMS output with Javascript. That's not what it's there for.


 

Posting Permissions

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