Re: [jQuery] jquery inside a loop... need suggestions to improvecode

[Michael E. Carluen]

Hey thanks Daemach. I got this to work for my purpose.  Btw, there was also
a    + "]"   that was missing from the script you sent.  Thanks for getting
me started though.

 

 

  _____  

From: [EMAIL PROTECTED] [mailto: [EMAIL PROTECTED]
<mailto:[EMAIL PROTECTED]> ] On Behalf Of Daemach
Sent: Friday, March 16, 2007 11:46 AM
To: jQuery Discussion.
Subject: Re: [jQuery] jquery inside a loop... need suggestions to
improvecode

 

Try this:

<cfoutput query="myQuery">
<a class="tooltip" id="aid_#myQuery.id#"
href="somepage.cfm?to=#myquery.id#">#myQuery.text#</a>
<img id="imgid_#myQuery.id#" src="/thumbnails/#myQuery.image#" /> 
</cfloop> 

<script type="text/javascript">
    $(document).ready(function(){
        $("img.tooltip").hide();
        
        $("a.tooltip").each(function(){        
            $(this).hover(function(){
                $("[EMAIL PROTECTED]" + this.id.split("_")[1]).show();
            },function(){
                $("[EMAIL PROTECTED]" + this.id.split ("_")[1]).hide();
            });
        })
    });
 </script>

On 3/16/07, Michael E. Carluen < <mailto:[EMAIL PROTECTED]>
[EMAIL PROTECTED]> wrote:

Hello (CF) jQuerians,

 

I currently have a working code but I would really like to improve and make
it more efficient. Your suggestions will be great.

Right now, I have a jquery script inside a loop (cfloop). The jquery is a
just simple tooltip-like functionality, that shows and hides a thumbnail
image on a text description hover. The image is loaded from a cfquery id
variable assigned into a div id.  What I'd like is to remove the jquery
script outside of the cfloop, so it does not redundantly iterate when the
page runs. The simplified code is as follows:

 

<cfloop query="myQuery">

            <a id="aid#myQuery.id#"
href="somepage.cfm?to=#myquery.id#">#myQuery.text#</a>

 

            <div id="imgid#myQuery.id#"><img
src="/thumbnails/#myQuery.image#" /></div>

            <script type="text/javascript">

                      $("##imgid#myQuery.id#").hide(); 

                      $(function(){ 

                            $("##aid#myQuery.id#").hover(function(){ 

                            $("##imgid#myQuery.id#").show(); 

                         },function(){ 

                            $("##imgid#myQuery.id#").hide(); 

                          });       

                       });

             </script>

</cfloop>

 

If the answer seems too obvious for you, then I must say that its been a
long week for me. I just need a brain boost from someone.. :-)

 

Thank you very much in advance, for your suggestions.

 

Michael

 

 

 


_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

 


_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

 


_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/