2012-12-20 2 views
1

Im essayant d'obtenir ma boîte div à disparaître dans lente et agréable quand je clique sur les liens de paginationboîte de div fondu lorsque vous cliquez sur ajaxpagination

Heres les

js

<script type="text/javascript"> 
    $(document).ready(function(e){ 
    $('.ajaxpagination').on('click', function(e){ 
     $('#news_box').fadeToggle('slow'); 
    }); 
    }); 
    </script> 

Heres le code html

<h2 class="black"> Recent News <div class="line_section"><div> </h2> 
<%= ajax_links :section_id => "recent_news" do %> 
    <%= will_paginate @news_all %> 
<% end %> 
<div id="news_box" class="row"> 
    <div class="span12"> 
    <ul class="recent-news"> 
     <%= ajax_loadzone do %> 
     <% @news_all.each do |news| %> 
      <li style="font-size: 16px; line-height: 19px; letter-spacing: 1px; font-size: 14px; color: #555; text-align: left;"> 
      <%= link_to image_tag(news.photo.url), news, class: 'pull-left', style: 'margin-right:40px; margin-top: 2px; width: 300px;' %> 
      <div style=" width: 600px; float: right;"> 
       <%= link_to news.title, news %> <br /> 
       <%= link_to news.date, news, style: 'font-size: 10px; color: black; position: relative; top: 15px;' %> 
       <i style="position: relative; top: 18px;" class="icon-comment"><%= link_to (news.comments.count), news, :style => 'font-size: 8px; color: white; font-weight: bold; position: absolute; top: 0px; right: 5px;' %></i> 
       <br /> <br /> 
       <%= truncate news.content, length: 500 %> <br /> 
       <%= link_to 'Read More...', news, style: 'font-size: 12px !important;' %> 
      </div> 
      </li> 
     <% end %> 
     <% end %> 
     <%= will_paginate @news_all %> 
    </div><!-- end span12 --> 
</div><!-- end row --> 

Heres un lien vers la page http://www.batman-fansite.com/batnews

J'ai eu l'effet de travailler, mais il semble juste ne pas bien l'animation vient et va trop vite

+1

maintenant C'est ce que les sites Web devraient être. – Blender

+0

merci im obsédé par batman – user1502223

Répondre

0

Essayez d'utiliser la valeur miliseconds

<script type="text/javascript"> 
$(document).ready(function(e){ 
    $('.ajaxpagination').on('click', function(e){ 
    $('#news_box').fadeToggle(4000); 
    }); 
    }); 
</script> 
+0

ouais j'ai essayé que cela fonctionne mais encore une fois l'animation va et vient trop vite – user1502223

Questions connexes