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...



<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:


<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.

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.

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 (http://kacv.org/index.php?module=article&id=228)

Well, if you want
<a id="onload" href="index.php?module=article&id=206#data"> </a>
to really be
<a id="onload" href="#data"> </a>
you can easily do something like
$('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.