Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Sep 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    jquery conflict problem (may be)

    Dear All,

    Hello, i am newbie to jquery but some how i can apply jquery effect on my webpages. i have a webpage where i have to put 2 jquery effects (accordian and image scroll), so this is the first time i am including 2 jquery effects in one page and the problem is only accordian effect is smoothly running but image scroll effect is not running. I think this is because of jquery conflict because i researched in google about it and i also get some idea to make it work but didnt get success. I have copy and pasted
    <script>
    jQuery.noConflict();

    // Use jQuery via jQuery(...)
    jQuery(document).ready(function(){
    jQuery("div").hide();
    });

    // Use Prototype with $(...), etc.
    $('someid').style.display = 'none';
    </script>
    code but it didnt solve my problem.

    here is my code of jquery.


    <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
    <script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script>
    <script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script>
    <script type="text/javascript" src="js/coda-slider.1.1.1.pack.js"></script>
    <script type="text/javascript">

    var theInt = null;
    var $crosslink, $navthumb;
    var curclicked = 0;

    theInterval = function(cur){
    clearInterval(theInt);

    if( typeof cur != 'undefined' )
    curclicked = cur;

    $crosslink.removeClass("active-thumb");
    $navthumb.eq(curclicked).parent().addClass("active-thumb");
    $(".stripNav ul li a").eq(curclicked).trigger('click');

    theInt = setInterval(function(){
    $crosslink.removeClass("active-thumb");
    $navthumb.eq(curclicked).parent().addClass("active-thumb");
    $(".stripNav ul li a").eq(curclicked).trigger('click');
    curclicked++;
    if( 6 == curclicked )
    curclicked = 0;

    }, 3000);
    };

    $(function(){

    $("#main-photo-slider").codaSlider();

    $navthumb = $(".nav-thumb");
    $crosslink = $(".cross-link");

    $navthumb
    .click(function() {
    var $this = $(this);
    theInterval($this.parent().attr('href').slice(1) - 1);
    return false;
    });

    theInterval();
    });
    </script>

    <!--product gallery image end-->


    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/ddaccordion.js">

    /***********************************************
    * Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
    * This notice must stay intact for legal use
    ***********************************************/

    </script>


    <script type="text/javascript">

    ddaccordion.init({ //top level headers initialization
    headerclass: "expandable", //Shared CSS class name of headers group that are expandable
    contentclass: "categoryitems", //Shared CSS class name of contents group
    revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
    mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
    collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
    defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
    onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
    animatedefault: false, //Should contents open by default be animated into view?
    persiststate: true, //persist state of opened contents within browser session?
    toggleclass: ["", "openheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
    togglehtml: ["prefix", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
    animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
    oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
    //do nothing
    },
    onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
    //do nothing
    }
    })

    ddaccordion.init({ //2nd level headers initialization
    headerclass: "subexpandable", //Shared CSS class name of sub headers group that are expandable
    contentclass: "subcategoryitems", //Shared CSS class name of sub contents group
    revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click" or "mouseover
    mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
    collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
    defaultexpanded: [], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
    onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
    animatedefault: false, //Should contents open by default be animated into view?
    persiststate: true, //persist state of opened contents within browser session?
    toggleclass: ["opensubheader", "closedsubheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
    togglehtml: ["none", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
    animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
    oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
    //do nothing
    },
    onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
    //do nothing
    }
    })


    </script>

    i checked through .js files also but its so scrambled that i even cant recognize wat is wat.

    so dear seniors,

    plz help me.

    I will really appreciate.

  • #2
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,957
    Thanks
    9
    Thanked 727 Times in 721 Posts
    Please wrap your code in code/hash tags.

    You are loading jquery twice:

    Code:
    <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
    <script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script>
    <script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script>
    <script type="text/javascript" src="js/coda-slider.1.1.1.pack.js"></script>
    <script type="text/javascript">
    
    var theInt = null;
    var $crosslink, $navthumb;
    var curclicked = 0;
    
    theInterval = function(cur){
    clearInterval(theInt);
    
    if( typeof cur != 'undefined' )
    curclicked = cur;
    
    $crosslink.removeClass("active-thumb");
    $navthumb.eq(curclicked).parent().addClass("active-thumb");
    $(".stripNav ul li a").eq(curclicked).trigger('click');
    
    theInt = setInterval(function(){
    $crosslink.removeClass("active-thumb");
    $navthumb.eq(curclicked).parent().addClass("active-thumb");
    $(".stripNav ul li a").eq(curclicked).trigger('click');
    curclicked++;
    if( 6 == curclicked )
    curclicked = 0;
    
    }, 3000);
    };
    
    $(function(){
    
    $("#main-photo-slider").codaSlider();
    
    $navthumb = $(".nav-thumb");
    $crosslink = $(".cross-link");
    
    $navthumb
    .click(function() {
    var $this = $(this);
    theInterval($this.parent().attr('href').slice(1) - 1);
    return false;
    });
    
    theInterval();
    });
    </script>
    
    <!--product gallery image end-->
    
    
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/ddaccordion.js">
    To start, remove the second load and give that a try.

  • #3
    New to the CF scene
    Join Date
    Sep 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanx a lot and lot, tonnes of thanx to you, it worked. i just removed this line:
    <script type="text/javascript" src="js/jquery.min.js"></script>

    thanx a lot sir.


    Quote Originally Posted by SB65 View Post
    Please wrap your code in code/hash tags.

    You are loading jquery twice:

    Code:
    <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
    <script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script>
    <script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script>
    <script type="text/javascript" src="js/coda-slider.1.1.1.pack.js"></script>
    <script type="text/javascript">
    
    var theInt = null;
    var $crosslink, $navthumb;
    var curclicked = 0;
    
    theInterval = function(cur){
    clearInterval(theInt);
    
    if( typeof cur != 'undefined' )
    curclicked = cur;
    
    $crosslink.removeClass("active-thumb");
    $navthumb.eq(curclicked).parent().addClass("active-thumb");
    $(".stripNav ul li a").eq(curclicked).trigger('click');
    
    theInt = setInterval(function(){
    $crosslink.removeClass("active-thumb");
    $navthumb.eq(curclicked).parent().addClass("active-thumb");
    $(".stripNav ul li a").eq(curclicked).trigger('click');
    curclicked++;
    if( 6 == curclicked )
    curclicked = 0;
    
    }, 3000);
    };
    
    $(function(){
    
    $("#main-photo-slider").codaSlider();
    
    $navthumb = $(".nav-thumb");
    $crosslink = $(".cross-link");
    
    $navthumb
    .click(function() {
    var $this = $(this);
    theInterval($this.parent().attr('href').slice(1) - 1);
    return false;
    });
    
    theInterval();
    });
    </script>
    
    <!--product gallery image end-->
    
    
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/ddaccordion.js">
    To start, remove the second load and give that a try.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •