lightbox style popup conflicts with menu

tpeck · 11-12-2010, 10:18 AM

I have a few hundred popups that I am trying to change to a "lightbox" style solution:

Code:

<!DOCTYPE html>
<html>

<head>
<title>Test 1</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script src="../../js/jquery.colorbox-min.js"></script>
<link rel="stylesheet" href="../../css/colorbox5.css" media="screen">
<script src="../../js/ssm.js" type="text/javascript"></script>
<script src="../../js/ssmitems3a.js" type="text/javascript"></script>
<link rel="stylesheet" href="../../css/ssmitems.css" type="text/css">

<script>
$(document).ready(function(){
$("a[rel='tip']").colorbox();
});
</script>
</head>

</script>
<body>
<a rel="tip" href="tip1(AC)2.html"><img border="0" src="../../img/tipani1.gif" width="50" height="74"></a>
</body>

</html>

The new colorbox popup solution works well, but in some browsers - notably IE - it conflicts with the SIDE MENU routine I use.

I think the menu is old code, but it works.

However, to get the new "lightbox-style" popup to work in IE, I have to include <!DOCTYPE html>.

In the other browsers, omitting the declaration apparently solves the conflict problem (but I feel it ought to be there).

I really don't know what to do. Tinker with the side menu code?

Here is a demo with the <!DOCTYPE html> declaration:

http://www.aapress.com.au/ieltsonlin...conflict1.html

...and without it:

http://www.aapress.com.au/ieltsonlin...conflict2.html

I have tried with a full declaration but it makes no difference at all. And further reading online suggests <!DOCTYPE html> is OK.

Does anyone spot a reason for the conflict?

gusblake · 11-12-2010, 11:49 AM

It's worth trying all the different DOCTYPEs first (loose, strict, transitional etc). It might be that different browsers default to different types, so you need to specify.

Old Pedant · 11-13-2010, 12:33 AM

WHY would you create a page that uses jQuery and then include an ancient history JS script from 2002 that is still trying to support MSIE 4 and Netscape 4 and who knows what else???

Code:

NS6=(document.getElementById&&!document.all)
IE=(document.all);
IE4=(document.all&&!document.getElementById)
NS=(navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")
OP=(navigator.userAgent.indexOf('Opera')>-1)

jQuery can surely do a slider like that in maybe a half dozen lines of jQuery code.
I'm not a jQuery uses, but I know I'd never try to mix jQuery with anything as ancient as that.

If you see document.all in JS code, it's a sure sign you should RUN, not walk, as fast as you can away from that code.

tpeck · 11-13-2010, 07:31 AM

Well, yes. If I could exactly match that SIDE MENU look and function with something like jquery I would. But I'm stuck with it unless the look and function is just about exactly reproducible (it's inside a huge proprietary system that runs old code on purpose! True...)

But I agree with everything you say.