开发者

Creating an onAfter Event for Kwicks jQuery plugin

I'm using Kwicks jQuery plugin for my portfolio. I want to show a child container within the list item after the kwicks click event. I can't seem to find a hook for this, at least within the parameters of the kwicks plugin.

After doing some research I couldn't find anything. Anybody know how to achieve this?

I'm using jQuery 1.4.2 and Kwicks 1.5.1.

P.S. If you couldn't tell, I'm a total jQuery/javascript noob.

Code:

<script type="text/javascript">

$().ready(function() {

 $('#projects').kwicks({
  max : 720,
  event : 'click'
 });


 $('.desc').show();
});

</script>


<ul id="projects">
    <li>
     开发者_如何学C <div class="desc">
      <h3><%= project.title %></h3>
      <p>blah blah blah<%= project.description %></p>
      </div>
    </li>
    <li>
      <div class="desc">
      <h3><%= project.title %></h3>
      <p>blah blah blah<%= project.description %></p>
      </div>
    </li>
</ul>

Thanks in advance for your help.


There is no way of doing it without patching Kwicks.

To patch it, in line 125 of the non-minified code after

easing: o.easing

add a comma and then:

complete: function()
{
    // your code
}

Or, to use a custom function every time:

complete: o.onAfter


I ended up using fudgey's rewrite of the kwicks (http://github.com/Mottie/Kwicks) and it worked like a champ. This is what I ended up with:

$(document).ready(function() {

  function hideAllDesc(){ // Fades out all descriptions that are shown before expanding a new one
    $('#projects li .desc').fadeOut();
  }

  function showDesc(){ // Shows description on expand
    $('#projects li.active .desc').fadeIn();
  }

  function hideDesc(){ // Hides description on collapse/mouseout
    $('#projects li.active .desc').fadeOut();
  }

  $('#projects').kwicks({
    max : 720,
    event : 'click',
    init : hideAllDesc,
    expanding : showDesc,    
    collapsing : hideDesc

  });

});

Thanks for your help everybody!

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜