Jquery conflict need some help

[mshack]

I have to scripts embedded into my site.

Independently they both work fine, but when I use them both, only one will work. I am a noob to coding and would appreciate some advanced help.

Here are the 2 scripts i put in my html

<script type="text/javascript" language="javascript" src="http://nitrografixx.com/accodion_menu/jquery.min.js"></script>
<script src="http://nitrografixx.com/accodion_menu/jquery-ui-1.8.4.custom.min.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript" src="http://nitrografixx.com/accodion_menu/script.js"></script>


<script type="text/javascript">
jQuery.noConflict();

jQuery(function() {
jQuery("#tabs").tabs({ fx: { opacity: 'toggle' } });
});
jQuery(document).ready(function () {
jQuery('.infiniteCarousel').infiniteCarousel();
});
jQuery(function() {
jQuery("#accordion").accordion({ autoHeight: false });
});
jQuery(document).ready(function() {
jQuery(".various").fancybox({
'titleShow' : false
});
});
</script>



<script type="text/javascript" src="http://nitrografixx.com/templates/article_slide_js/jquery.min.js"></script>

<script type="text/javascript" src="http://nitrografixx.com/templates/article_slide_js/jquery.easing.1.3.min.js"></script>
<script type="text/javascript" src="http://nitrografixx.com/templates/article_slide_js/jquery.DDSlider.js"></script>


<!-- START ARTICLE SLIDE -->

<script type="text/javascript">

//triggers the slider
$(document).ready(function() {

$('#yourSliderId').DDSlider({

nextSlide: '.slider_arrow_right',
prevSlide: '.slider_arrow_left',
selector: '.slider_selector'

});

});

</script>

[mshack]

i can paypal $10 for someone to get this fixed for me

I hate coding, but most of us graphics guys do, lol.

[SB65]

It looks like you have jquery loaded more than once - highlighted in red below:

<script type="text/javascript" language="javascript" src="http://nitrografixx.com/accodion_menu/jquery.min.js"></script>
<script src="http://nitrografixx.com/accodion_menu/jquery-ui-1.8.4.custom.min.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript" src="http://nitrografixx.com/accodion_menu/script.js"></script>


<script type="text/javascript">
jQuery.noConflict();

jQuery(function() {
jQuery("#tabs").tabs({ fx: { opacity: 'toggle' } });
});
jQuery(document).ready(function () {
jQuery('.infiniteCarousel').infiniteCarousel();
});
jQuery(function() {
jQuery("#accordion").accordion({ autoHeight: false });
});
jQuery(document).ready(function() {
jQuery(".various").fancybox({
'titleShow' : false
});
});
</script>



<script type="text/javascript" src="http://nitrografixx.com/templates/article_slide_js/jquery.min.js"></script>

<script type="text/javascript" src="http://nitrografixx.com/templates/article_slide_js/jquery.easing.1.3.min.js"></script>
<script type="text/javascript" src="http://nitrografixx.com/templates/article_slide_js/jquery.DDSlider.js"></script>


<!-- START ARTICLE SLIDE -->

<script type="text/javascript">

//triggers the slider
$(document).ready(function() {

$('#yourSliderId').DDSlider({

nextSlide: '.slider_arrow_right',
prevSlide: '.slider_arrow_left',
selector: '.slider_selector'

});

});

</script>

Take the second one out and give that a try.

[mshack]

that works.........but only if i have them both in the same html sheet

I have them in separate tabs , so if i remove the jquery.min.js when i separate them, then only one works again.

Any idea on how to get them both to function when in different tab content

[SB65]

Not sure I quite understand your situation - are you saying that in some cases you have both effects loaded on a single html page, and in other cases only one?

[mshack]

here is a test of the two scripts

http://www.nitrografixx.com/111.htm



If i put the article slider first in the html, then both run fine , if i put the accordion menu first, only one will work.

I remove the min.js from the 2nd script in each instance, only leaving it in the first one.

I want the menu on the left side, but for some reason both will not run when i do so.

[SB65]

I think the problem is the code in red below:

<script type="text/javascript">
    jQuery.noConflict();

    jQuery(function() {
        jQuery("#tabs").tabs({ fx: { opacity: 'toggle' } });
    });
    jQuery(document).ready(function () {
         jQuery('.infiniteCarousel').infiniteCarousel();
    });
    jQuery(function() {
        jQuery("#accordion").accordion({ autoHeight: false });
    });
    jQuery(document).ready(function() {
        jQuery(".various").fancybox({
            'titleShow'        : false
        });
    });
</script>

I think you've changed the code linked from your last post in the last half hour or so - but with your original code I removed one of the jquery loads and the red highlighted text and all is well, with the menu on the left. You don't have .various classes on the page anyway, but I think the page may be falling over the fancybook method.

With your amended html ordering (menu on right), this bit of code comes last and thus has no effect, which is why this also fixes things.

[mshack]

thank you very much, that was the issue

working perfectly now
http://www25.myfantasyleague.com/2010/home/47873#0