基于jQuery實現(xiàn)仿搜狐辯論投票動畫代碼(附源碼下載)
更新時間：2016年02月18日 14:25:57 投稿：mrr
這篇文章主要介紹了基于jQuery實現(xiàn)仿搜狐辯論投票動畫代碼 的相關資料,需要的朋友可以參考下
基于jQuery實現(xiàn)仿搜狐辯論投票動畫代碼 ，一款個性的卡通小人正方反方辯論投票特效代碼。移動動畫效果平滑自然。具有非常好的用戶體驗。該源碼兼容目前最新的各類主流瀏覽器。
html代碼：
<script type="text/javascript">
$(document).ready(function () {
var a = 500;
var b = 130;
$("#white").animate({ width: 0, left: "250px" }, 1000, function () {
$("#vs").fadeIn("slow", function () {
$("#all").html(a + b); $("#aa").html(a); $("#bb").html(b);
var newLeft = a / (a + b) * 500 - 20 + "px"; //20為vs 的一半
$("#vs").animate({ left: newLeft }, 1000);
$("#red").animate({ width: newLeft }, 1000);
});
});
});
</script>
<div id="box_bg">
<div id="container">
<div id="green" class="line"></div>
<div id="red" class="line"></div>
<div id="white" class="line"></div>
<div id="vs"></div>
</div>
</div>
<div style="width:440px; margin:0px auto;">
<div id="aa2" class="scope">正方<span id="aa"></span>票</div>
<div id="bb2" class="scope">反共<span id="bb"></span>票</div>
<div id="all2" class="scope">總共<span id="all"></span>票</div>
</div>
以上代碼是基于jQuery實現(xiàn)仿搜狐辯論投票動畫代碼，希望對大家有所幫助！
相關文章
這篇文章主要介紹了jQuery實現(xiàn)本地預覽上傳圖片功能，為大家推薦了一款圖片上傳預覽插件，感興趣的小伙伴們可以參考一下2016-01-01
BootStrap iCheck插件全選與獲取value值的解決方法
這篇文章主要介紹了BootStrap iCheck插件全選與獲取value值的解決方法,解決方法其實很簡單，下面小編給大家分享下這方面的知識2016-08-08
jquery如何取得text,areatext,radio,checkbox,select的值,以及其他一些操作.2010-07-07
這篇文章主要介紹了jQuery 表單序列化實例代碼,需要的朋友可以參考下2017-06-06
jQuery 使用手冊，大家可以耐心的看完，就基本上入門了。2009-09-09
內(nèi)容過濾選擇器：根據(jù)元素中的文字內(nèi)容或所包含的子元素特征獲取元素，其文字內(nèi)容可以模糊或絕對匹配進行元素定位，接下來為大家詳細介紹下jQuery選擇器，感興趣的朋友可以參考下哈2013-04-04
利用jquery的獲取JS文件中的字符串內(nèi)容的代碼，需要的朋友可以參考下2012-02-02
這篇文章主要介紹了EasyUI Tree樹組件無限循環(huán)的解決方法,需要的朋友可以參考下2017-09-09
這篇文章主要介紹了jQuery 跨域訪問解決原理案例詳解的相關資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-07-07
jquery使用remove()方法刪除指定class子元素
這篇文章主要介紹了jquery使用remove()方法刪除指定class子元素的方法,可實現(xiàn)刪除指定元素下指定class的子元素功能,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03