2 jquerys on the same page

  • Rika
  • Newbie
  • Newbie
  • Rika
  • Posts: 14
  • Loc: Singapore

Post 3+ Months Ago

I'm trying to put 2 jquery plugins on the same html page. However it only works when there is one jquery. i know it can be done since i have seen websites using 2 jquerys. Can anyone help with this? I'm really stuck.
Code: [ Select ]
<link rel="stylesheet" type="text/css" href="css/featuredcontentglider.css" />
<link rel="stylesheet" type="text/css" href="css/contactform.css" />
<script language="javascript" type="text/javascript">
function clearText(field)
{
  if (field.defaultValue == field.value) field.value = '';
  else if (field.value == '') field.value = field.defaultValue;
}
</script>


<link rel="stylesheet" type="text/css" href="css/jquery.accessible-news-slider.css" />
<script language="javascript" type="text/javascript" src="scripts/jquery-1.2.6.pack.js"></script>
<script language="javascript" type="text/javascript" src="scripts/jquery.accessible-news-slider.js"></script>
<script language="javascript" type="text/javascript">
    
    $(function() {
    
        $( "#example_1" ).accessNews({
        headline : "Candy Coated",
        speed : "normal",
            slideBy : 2
      });
        
    });
    
</script>
<script type="text/javascript" src="scripts/jquery.min.js"></script>
<script type="text/javascript" src="scripts/featuredcontentglider.js"></script>
<script language="javascript" src="scripts/jquery-1.2.6.min.js" type="text/javascript"></script>
<script type="text/javascript">
      $(document).ready(function(){

        $("#contactLink").click(function(){
          if ($("#contactForm").is(":hidden")){
            $("#contactForm").slideDown("slow");
          }
          else{
            $("#contactForm").slideUp("slow");
          }
        });
        
      });
      
      function closeForm(){
        $("#messageSent").show("slow");
        setTimeout('$("#messageSent").hide();$("#contactForm").slideUp("slow")', 2000);
      }
    </script>
  1. <link rel="stylesheet" type="text/css" href="css/featuredcontentglider.css" />
  2. <link rel="stylesheet" type="text/css" href="css/contactform.css" />
  3. <script language="javascript" type="text/javascript">
  4. function clearText(field)
  5. {
  6.   if (field.defaultValue == field.value) field.value = '';
  7.   else if (field.value == '') field.value = field.defaultValue;
  8. }
  9. </script>
  10. <link rel="stylesheet" type="text/css" href="css/jquery.accessible-news-slider.css" />
  11. <script language="javascript" type="text/javascript" src="scripts/jquery-1.2.6.pack.js"></script>
  12. <script language="javascript" type="text/javascript" src="scripts/jquery.accessible-news-slider.js"></script>
  13. <script language="javascript" type="text/javascript">
  14.     
  15.     $(function() {
  16.     
  17.         $( "#example_1" ).accessNews({
  18.         headline : "Candy Coated",
  19.         speed : "normal",
  20.             slideBy : 2
  21.       });
  22.         
  23.     });
  24.     
  25. </script>
  26. <script type="text/javascript" src="scripts/jquery.min.js"></script>
  27. <script type="text/javascript" src="scripts/featuredcontentglider.js"></script>
  28. <script language="javascript" src="scripts/jquery-1.2.6.min.js" type="text/javascript"></script>
  29. <script type="text/javascript">
  30.       $(document).ready(function(){
  31.         $("#contactLink").click(function(){
  32.           if ($("#contactForm").is(":hidden")){
  33.             $("#contactForm").slideDown("slow");
  34.           }
  35.           else{
  36.             $("#contactForm").slideUp("slow");
  37.           }
  38.         });
  39.         
  40.       });
  41.       
  42.       function closeForm(){
  43.         $("#messageSent").show("slow");
  44.         setTimeout('$("#messageSent").hide();$("#contactForm").slideUp("slow")', 2000);
  45.       }
  46.     </script>
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • graphixboy
  • Control + Z
  • Mastermind
  • User avatar
  • Posts: 1828
  • Loc: In the Great White North

Post 3+ Months Ago

You don't need multiple copies of actual jquery base. Remove line 28 and line 13. Then move line 30 to be the first js call. The reason it doesn't work is that you simply overwriting the library code each time and causing conflicts.

You can have multiple plugins (items that extend the jquery base) but only one base version of jquery.

I would also recommend grabbing a newer version of jquery 1.2.6 is quite old now.

Post Information

  • Total Posts in this topic: 2 posts
  • Users browsing this forum: No registered users and 66 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.