jQuery melaksanakan kesan gerakan mendatar dengan penimbalan mendatar (dengan muat turun kod sumber demo)

jQuery melaksanakan kesan gerakan mendatar dengan penimbalan mendatar (dengan muat turun kod sumber demo)_jquery

WBOY

Lepaskan： 2016-05-16 15:17:00

asal

1316 orang telah melayarinya

Contoh dalam artikel ini menerangkan pelaksanaan jQuery bagi kesan gerakan mendatar dengan penimbalan mendatar. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

JQuery digunakan di sini untuk menjana gerakan mendatar penimbal mendatar, yang boleh diaktifkan dengan mengklik tetikus Selepas mengklik, anda boleh melihat bahawa lapisan Div bergerak secara mendatar, yang mana banyak bentuk kesan animasi lain boleh diperolehi.

Klik di sini untuk melihat tunjuk cara dalam talian .

Kod khusus adalah seperti berikut:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>水平移动</title>
<style type="text/css">
*{margin:0;padding:0;}
body { padding: 60px }
#panel {position: relative; width: 100px; height:100px;border: 1px solid #0050D0;background: #96E555; cursor: pointer}
</style>
<script src="jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
  $("#panel").click(function(){
    $(this).animate({left: "500px"}, 3000);
  })
})
</script>
</head>
<body>
<div id="panel"></div>
</body>
</html>

Salin selepas log masuk

Klik di sini untuk kod contoh lengkapMuat turun dari tapak ini.

Pembaca yang berminat dengan lebih banyak kandungan yang berkaitan dengan kesan khas jQuery boleh menyemak topik khas di tapak ini: "Ringkasan animasi jQuery dan penggunaan kesan khas" dan "Ringkasan klasik biasa kesan khas jQuery"

Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan jQuery.