cari

Rumah >hujung hadapan web >tutorial js >jQuery melaksanakan kesan gerakan mendatar dengan penimbalan mendatar (dengan muat turun kod sumber demo)_jquery

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

WBOY
WBOYasal
2016-05-16 15:17:001352semak imbas

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>

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.

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：jumlah pemformatan js dan nombor kad bank dalam kotak input_kemahiran javascriptArtikel seterusnya：jumlah pemformatan js dan nombor kad bank dalam kotak input_kemahiran javascript

Artikel berkaitan

Lihat lagi