Pelaksanaan kod animasi undian perdebatan seperti Sohu berdasarkan jQuery (dengan muat turun kod sumber)_jquery

Berdasarkan jQuery, kod animasi undian perbahasan Sohu tiruan dilaksanakan, kod kesan khas pengundian penjahat kartun yang diperibadikan. Animasi pergerakan adalah lancar dan semula jadi. Mempunyai pengalaman pengguna yang sangat baik. Kod sumber serasi dengan penyemak imbas arus perdana terkini.

Demonstrasi kesan Muat turun kod sumber

kod 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>

Kod di atas adalah berdasarkan jQuery untuk melaksanakan kod animasi undian perdebatan seperti Sohu, saya harap ia akan membantu semua orang!