[...]How to resolve JQuery, Prototype, and lightbox issues to make them work on same page[...]…

[...]How to resolve JQuery, Prototype, and lightbox issues to make them work on same page[...]…

I tried to follow the above fix, but I know so little about javascript, i couldn’t work out what you meant by for example “reassign var $j = jQuery;” How do I do that? In the jquery-1.4.2.min.js ? Or just in the page head? Or both?

I tried fix 1, just adding the “noConflict” lines in the head section of the page and that made no difference at all.

Please help!

<3

<!—->
<!—->

<!—->

jQuery.noConflict();

jQuery(document).ready(function(){

jQuery(‘.boxgrid.caption’).each(function (){

jQuery(this).mouseenter (function(){
jQuery(this).find(“.cover”).animate({top:’50px’},{queue:false,duration:160});
});

jQuery(this).mouseleave (function(){
jQuery(this).find(“.cover”).animate({top:’150px’},{queue:false,duration:160});
});

});

jQuery(“a.external”).fancybox();

});

js/prototype.js
js/scriptaculous.js?load=effects,builder
js/lightbox.js
js/jquery.j

js/jquery.galleria.pack.js

jQuery(function($) {

$(‘.gallery_demo_unstyled’).addClass(‘gallery_demo’); // adds new class name to maintain degradability

$(‘ul.gallery_demo’).galleria({
history : true, // activates the history object for bookmarking, back-button etc.
clickNext : true, // helper for making the image clickable
insert : ‘#main_image’, // the containing selector for our main image
onImage : function(image,caption,thumb) { // let’s add some image effects for demonstration purposes

// fade in the image & caption
if(! ($.browser.mozilla && navigator.appVersion.indexOf(“Win”)!=-1) ) { // FF/Win fades large images terribly slow
image.css(‘display’,'none’).fadeIn(1000);
}
caption.css(‘display’,'none’).fadeIn(1000);

// fetch the thumbnail container
var _li = thumb.parents(‘li’);

// fade out inactive thumbnail
_li.siblings().children(‘img.selected’).fadeTo(500,0.3);

// fade in active thumbnail
thumb.fadeTo(‘fast’,1).addClass(‘selected’);

// add a title for the clickable image
image.attr(‘title’,'Next image >>’);
},
onThumb : function(thumb) { // thumbnail effects goes here

// fetch the thumbnail container
var _li = thumb.parents(‘li’);

// if thumbnail is active, fade all the way.
var _fadeTo = _li.is(‘.active’) ? ’1′ : ’0.3′;

// fade in the thumbnail when finnished loading
thumb.css({display:’none’,opacity:_fadeTo}).fadeIn(1500);

// hover effects
thumb.hover(
function() { thumb.fadeTo(‘fast’,1); },
function() { _li.not(‘.active’).children(‘img’).fadeTo(‘fast’,0.3); } // don’t fade out if the parent is active
)
}
});
});

the Galleria is working fine but Lightbox is just opening the images in a new window. I have pasted your above code into the header but it just breaks Galleria!

Many thanks in anticipation.

J

My MSIE8.0 has the above error when runing the following code on a page loading jquery.js and prototype.js:
——————————–
jQuery.noConflict();
jQuery(document).ready(function() {
var HTMLbackup = jQuery(‘#DemoContainer’).html();
jQuery(‘#DemoContainer’).data(‘bkup’,HTMLbackup);
jQuery(‘#DemoOptions li a’).click(function(){
window.scrollTo(0,0);
clearInterval(siteFeature2AutoPlayInterval);
jQuery(‘#DemoContainer’).empty().html(jQuery(‘#DemoContainer’).data(‘bkup’));
var nextFunct = jQuery(this).next().text();
if(this.hash == ‘#notext’){
jQuery(‘#preFeature2 div p’).remove();
}
jQuery(‘#DemoContainer h3.title’).text(jQuery(this).text());
eval(nextFunct);
return false;
}).filter(‘:first’).click();
});
—————————————-

Need help please! And thank you!

If any have problems try this:
In the jquery code ……
You must :
1 .- jQuery.noConflict(); at the begining of the
2 .- Replace ALL $(whatelse) whit jQuery(whatelse)

It works for me.
Thanks again for the solution!
Obi.

1) Look for

2) Enter $.noConflict(); just after that

3) Look for $(function() {

4) Replace it with jQuery(document).ready(function($) {