How to unbind mouseleave on click using jquery -


i have div when mouseenter previews image being shown - when mouseleave hides again.

what i'm trying achieve when click div animates , shows, i'd unbind 'mouseleave' functionality image stays on screen isn't working - mouseleave still kicking in.... can help?

here's code

$('.attachment').on({     mouseenter: function (e) {         tileid = (this.parentnode.id).substring(13);         $('#imagecontainer-' + tileid).css('visibility', 'visible');         $('#imagecontainer-' + tileid).css('overflow-y', 'hidden');         $('#imagecontainer-' + tileid).stop().animate({             height: 40         }, {             duration: 300,             easing: animationeasing,             queue: false         });      },     mouseleave: function (e) {         $('#imagecontainer-' + tileid).stop().animate({             height: 0         }, {             duration: 300,             easing: animationeasing,             queue: false,             complete: function () {                 $('#imagecontainer-' + tileid).css('visibility', 'collapse');             }         });      },     click: function () {          $('#attachmentlink-' + tileid).unbind('mouseleave');          $('#imagecontainer-' + tileid).stop().animate({             height: 610         }, {             duration: 300,             easing: animationeasing,             queue: false,             complete: function () {                 $('#imagecontainer-' + tileid).css('overflow-y', 'auto');             }         });     } }); 

html code reference:

 <div id="timelinecontainer">          <div id="timelinetophider"></div>         <div id="timelinebottomhider"></div>          <ul class="timeline">              <li id="timelineli-1">                  <div class="timelineicon letter"></div>                  <div class="datecontainer">                      <p>                         12th july 2013<br>                         17:13                     </p>                  </div>                  <div class="timelinetile" id="timelinetile-1">                      <a href="javascript:animatetile('1');" class="filldiv"></a>                      <div class="tiletitlecontainer" id="tiletitlecontainer-1">                         <span title="this long title test application of text ellipsis , should concatenate string">test title</span>                     </div>                      <div class="details" id="details-1">                         <table>                             <tr>                                 <td>name:</td>                                 <td>full name</td>                             </tr>                             <tr>                                 <td>type:</td>                                 <td>credit</td>                             </tr>                         </table>                      </div>                      <div class="arrow" id="arrow-1"></div>                      <div class="attachment" id="attachmentlink-1"></div>                        <div class="slideupinfo" id="slideupinfo-1">                          <p>                             name<br>                             info<br>                             12th july 2013, 17:13                         </p>                      </div>                      <div class="iconcontainer hidden">                         <a href="javascript:toggleimagecontainer(1);" id="iconcontainerlink-1">                             <img src="images/attachment.png" /></a>                     </div>                      <div class="imagecontainer hidden" id="imagecontainer-1">                          <img src="images/documents/1.png" />                      </div>                  </div>              </li>              </ul>          </div> 

you need use off:

$("#id").click(function(){      $("#id").off("mouseleave"); }); 

see http://api.jquery.com/off/


Comments

Popular posts from this blog

image - ClassNotFoundException when add a prebuilt apk into system.img in android -

I need to import mysql 5.1 to 5.5? -

Java, Hibernate, MySQL - store UTC date-time -