noConflict problem (again...newbie)

noConflict problem (again...newbie)

Hello everyone!

I am pretty much "fresh off the boat" when it comes to jQuery...I too like many others am trying to use both jquery-1.3.2.js along with prototype.js (as well as two other js files, called effects.js and lightwindow.js). I have read and attempted to implement the techniques to get the noConflict function to solve my conflicts with the $ used in both.

I have created a user login that clears the internal labels (this uses the jquery-1.3.2.js file) and lightwindow to create a modual window gallery (this uses prototype.js, effects.js, and lightwindow.js) The lightwindow javascript files can be found at http://www.stickmanlabs.com/lightwindow/#download

I have tried placing the code:

<script>
     jQuery.noConflict();
     
     // Use jQuery via jQuery(...)
     jQuery(document).ready(function(){
       jQuery("div").hide();
     });
     
     // Use Prototype with $(...), etc.
     $('someid').hide();
   </script>


...below my js includes. I then went about trying to change all the "$()" to "jQuery()" inside the function that uses the jQuery.js file. I don't know if this is the only place I have to change the "$()" or if I need to go into the protoype.js file or jquery-1.3.2.js files (etc) and change things there too.

Thus I am going to include my code/markup without any of the "$()" changes.

I would so greatly appreciate anyone's help and look forward to learning more on this forum and contributing as I learn (and become more competent).

Thanks in advance.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

   <title>Lorem Ipsum</title>
   <!-- Meta Tags -->
   <meta http-equiv="content-type" content="text/html; charset=utf-8" />
   
    <!-- CSS -->
    <link rel="stylesheet" type="text/css" href="css/default.css" />
    <link rel="stylesheet" type="text/css" href="css/lightwindow.css" />
   
   <!-- JavaScript -->
       <script type="text/javascript" src="javascript/prototype.js"></script>
       <script type="text/javascript" src="javascript/effects.js"></script>
       <script type="text/javascript" src="javascript/lightwindow.js"></script>
       <script type="text/javascript" src="js/jquery-1.3.2.js"></script>

        <script>
             jQuery.noConflict();
     
             // Use jQuery via jQuery(...)
             jQuery(document).ready(function(){
                   jQuery("div").hide();
            });
     
            // Use Prototype with $(...), etc.
           $('someid').hide();
       </script>

</head>

<body>
               <!-- Javascript used for the user login. This uses the jquery-1.3.3.js file-->
      <script type="text/javascript">$(document).ready(function() {
   
         var focusEvent = function() {
            if(this.type == 'text') {
               var html = $(this).clone().wrap('<span></span>').parent().html();
               html = html.replace(/type=("|')?text("|')?/, 'type="Password"');
               var $newPwdBx = $(html);     
               
               $(this).replaceWith($newPwdBx);
               $newPwdBx.removeClass('readOnly');
               $newPwdBx.val('');
               $newPwdBx.focus();
               $newPwdBx.blur(blurEvent);
            }
         };
      
         var blurEvent = function() {
            if(this.value == '') {
               var html = $(this).clone().wrap('<span></span>').parent().html();
               html = html.replace(/type=("|')?Password("|')?/, 'type="text"');
               var $newTxtBx = $(html);           
               $(this).replaceWith($newTxtBx);
               $newTxtBx.addClass('readOnly');
               $newTxtBx.val('Password');
               $newTxtBx.focus(focusEvent);
            }
         };
   
          $("#password").focus(focusEvent);
      });
      </script>
       
               <script type="text/javascript">
              var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
             document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
          </script>
   
    <script type="text/javascript">
      function clearText(field){
      
         if (field.defaultValue == field.value) field.value = '';
         else if (field.value == '') field.value = field.defaultValue;
      
      }   
    </script>

      <form id="userLogin" method="post" name="loginform" action="https://my.atlanticmetro.net/index.php">
              <div>
                    <input name="login" size="20" type="text" value="Username"  id="username" tabindex="1" onFocus="clearText(this)" onBlur="clearText(this)"/>
                   
                </div>
                <div>
                    <input name="pass" size="20" type="text" value="Password"id="password" tabindex="2" class="readOnly" />
                   
                </div>
                <button name="submit" type="submit" class="orangeButtons">Login</button>
                <a href="quote.php"><button type="submit" class="orangeButtons">Request Quote</button></a>
       </form>

               
                                       
               
                    <!-- BEGIN LGA1: NEW YORK, NY GALLERY -->
               
      
            <div class="page-body">
 
               <a href="gallery/LGA1/DSC_3328.jpg" class="lightwindow page-options" rel="Data Centers[LGA1: New York, NY]" title="LGA1: New York, NY" caption="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."></a>
                   
                   
                    <a href="gallery/LGA1/DSC_3340.jpg" class="lightwindow hidden" rel="Data Centers[LGA1: New York, NY]" title="LGA1: New York, NY" caption="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."></a>
                   
               <a href="gallery/LGA1/DSC_3366.jpg" class="lightwindow hidden" rel="Data Centers[LGA1: New York, NY]" title="LGA1: New York, NY" caption="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."></a>

      <!-- END LGA1: NEW YORK, NY GALLERY -->


               
                    <!-- BEGIN NJ3: NORTH BERGEN, NJ GALLERY -->
                   
                   
               <a href="gallery/NJ3/DSC_3208.jpg" class="lightwindow page-options" rel="Data Centers[NJ3: North Bergen, NJ]" title="NJ3: North Bergen, NJ" caption="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."></a>
                   
                   
                    <a href="gallery/NJ3/DSC_3262.jpg" class="lightwindow hidden" rel="Data Centers[NJ3: North Bergen, NJ]" title="NJ3: North Bergen, NJ" caption="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."></a>
                   
               <a href="gallery/NJ3/DSC_3267.jpg" class="lightwindow hidden" rel="Data Centers[NJ3: North Bergen, NJ]" title="NJ3: North Bergen, NJ" caption="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."></a>
                   
                 
         <!-- END NJ3: NORTH BERGEN, NJ GALLERY -->


</div>


</body>
</html>