用js怎么做小说网站那种排行榜？

Question

http://www.fensebook.com/index.php/Top就像这个网站中的排行榜那种特效   怎么用js做出来希望有人能给个例子  万分感谢！！！！！

Answer 1

就2个div，一个标题，一个带图，默认显示标题，带图的在添加active激活样式后切换下而已<script src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<style>.hot .img{display:none}.hot .active .img{display:block}.hot .active .word{display:none}</style>
<ul class="hot">
    <li class="active"><div class="word">标题1</div><div class="img">带图片的1</div></li>
    <li><div class="word">标题2</div><div class="img">带图片的2</div></li>
    <li><div class="word">标题3</div><div class="img">带图片的3</div></li>
</ul>
<script>
    $('ul.hot>li').mouseenter(function () { $(this).addClass('active').siblings().removeClass('active')})
</script>Web开发学习资料推荐
jquery全年日期选择器日历插件
easyui datagrid fitColumns:true失效解决办法

Answer 2

http://www.fensebook.com/index.php/Top

Answer 3

http://www.fensebook.com/index.php/Top
你这网站的书库效果怎么弄得

Answer 4

<script src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<style>.hot .img{display:none}.hot .active .img{display:block}.hot .active .word{display:none}</style>
<ul class="hot">
    <li class="active"><div class="word">标题1</div><div class="img"><a href="http://www.fensebook.com/index.php/Book/Index/id/2133842">
<img src=http://avatar.fensebook.com/20190215/5c6656d3c3e15.jpg></a>
</div></li>
    <li><div class="word">标题2</div><div class="img"><a href="http://www.fensebook.com/index.php/Book/Index/id/2133842">
<img src=http://avatar.fensebook.com/20190215/5c6656d3c3e15.jpg></a>带图片的2</div></li>
    <li><div class="word">标题3</div><div class="img">带图片的3</div></li>
</ul>
<script>
    $('ul.hot>li').mouseenter(function () { $(this).addClass('active').siblings().removeClass('active')})
</script>前面的就是例子啊，还要啥例子啊！