Get rid of the lightbox scripts and styles completely. But keep your rel="lightbox" links just the way they are. Download and install Slimbox2:
http://www.digitalia.be/software/slimbox2
on the 'top' page before the menu script and get rid of:
Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
from the head code of the menu script.
So in the head of the 'top' page, you have (plus whatever you already have for the AJAX script):
Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="js/slimbox2.js"></script>
<link rel="stylesheet" href="css/slimbox2.css" type="text/css" media="screen" />
<link rel="stylesheet" type="text/css" href="drilldownmenu.css" />
<script type="text/javascript" src="drilldownmenu.js">
/***********************************************
* Drill Down Menu script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
</script>
<script type="text/javascript">
var mymenu=new drilldownmenu({
menuid: 'drillmenu1',
menuheight: 'auto',
breadcrumbid: 'drillcrumb',
persist: {enable: true, overrideselectedul: true}
})
</script>
Using a text only editor like NotePad, in the slimbox2.js file, replace this:
Code:
// AUTOLOAD CODE BLOCK (MAY BE CHANGED OR REMOVED)
if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent)) {
jQuery(function($) {
$("a[rel^='lightbox']").slimbox({/* Put custom options here */}, null, function(el) {
return (this == el) || ((this.rel.length > 8) && (this.rel == el.rel));
});
});
}
with:
Code:
// Live invocation for use with other scripts, image maps, AJAX, etc. - also skips duplicates when forming groups
// Uses the rev attribute of the tag for a caption, freeing up the title for other uses or to be blank.
// Remove the AUTOLOAD CODE BLOCK if using this, or replace it with this code.
// Live Load Script (c)2011 John Davenport Scheuer - for use with Slimbox 2.04
// as first seen in http://www.dynamicdrive.com/forums/
// username: jscheuer1 - This Notice Must Remain for Legal Use
(function($){
if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent)) {
$('*[href][rel^=lightbox]').live('click', function(e){
var t = this, rel = t.getAttribute('rel'), hrefs = [], links = [], index;
if(rel === 'lightbox'){
$.slimbox(t.href, t.getAttribute('rev') || '', { /* Options */ });
} else {
$('*[href][rel="' + rel + '"]').each(function(){
if($.inArray(this.href, hrefs) < 0){
if(t.href === this.href){index = hrefs.length;}
hrefs.push(this.href);
links.push([this.href, this.getAttribute('rev') || '']);
}
});
$.slimbox(links, index, {loop: true /* , Aditional Options */ });
}
e.preventDefault();
});
}
})(jQuery);
Your rel="lightbox" links will now work on the imported page. The only difference is that instead of the title attribute being used for the caption, the rev attribute will be.
If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.
Combining scripts
Reply With Quote
Bookmarks