تصف هذه المقالة طريقة تبديل تأثيرات الرسوم المتحركة للستائر الأفقية تؤثر على صفحات الويب في JS. شاركه للرجوع إليه. التحليل المحدد هو كما يلي:
هذا هو تأثير تبديل صفحة ويب بسيط للغاية ولكنه جيد. بعد النقر على صفحة ويب جديدة ، ستبدأ صفحة الويب تلقائيًا بين الستائر الزرقاء والأبيض حتى يتم عرض جميع صفحات الويب بالكامل. الرمز كما يلي:
انسخ الرمز كما يلي: <html>
<head>
<title> JS Web Blinds تأثير التبديل الديناميكي </title>
<style>
<!-
.intro {
الموقف: مطلق ؛
اليسار: 0 ؛
أعلى: 0 ؛
طبقة الخلفية اللون: الأزرق.
لون الخلفية: الأزرق.
الحدود: 0.1 بكسل الأزرق الصلب
}
->
</style>
</head>
<body>
<div id = "i1"> </viv> <div id = "i2"> </viv> <div id = "i3"
class = "intro"> </viv> <div id = "i4"> </viv> <div id = "i5"> </viv> <viv> <div
id = "i6"> </viv> <div id = "i7"> </viv> <div id = "i8"> </viv>
<script language = "javaScript1.2">
var speed = 20
var temp = new array ()
var temp2 = new array ()
if (document.layers) {
لـ (i = 1 ؛ i <= 8 ؛ i ++) {
temp [i] = eval ("document.i"+i+". clip")
temp2 [i] = eval ("document.i"+i)
درجة الحرارة [i] .width = window.innerwidth
درجة الحرارة [i] .hight = window.innerheight/8
temp2 [i] .top = (i-1)*temp [i]. height
}
}
آخر إذا (document.all) {
var clipright = document.body.clientwidth ، clift = 0
لـ (i = 1 ؛ i <= 8 ؛ i ++) {
temp [i] = eval ("document.all.i"+i+". style")
temp [i] .width = document.body.clientwidth
درجة الحرارة [i]
Temp [i] .top = (I-1)*parseint (temp [i]. home)
}
}
وظيفة OpenIt () {
window.scrollto (0،0)
if (document.layers) {
لـ (i = 1 ؛ i <= 8 ؛ i = i+2)
درجة الحرارة [i] .right- = السرعة
لـ (i = 2 ؛ i <= 8 ؛ i = i+2)
درجة الحرارة [i] .left+= السرعة
if (temp [2] .Left> window.innerwidth)
ClearInterval (StopIt)
}
آخر إذا (document.all) {
ClipRight- = السرعة
لـ (i = 1 ؛ i <= 8 ؛ i = i+2) {
temp [i] .clip = "rect (0"+clipright+"Auto 0)"
}
Clipleft+= السرعة
لـ (i = 2 ؛ i <= 8 ؛ i = i+2) {
temp [i] .clip = "Rect (0 Auto Auto"+Clipleft+")"
}
إذا (ClipRight <= 0)
ClearInterval (StopIt)
}
}
وظيفة gogo () {
StopIt = setInterval ("OpenIt ()" ، 100)
}
gogo ()
</script>
</body>
</html>
آمل أن تكون هذه المقالة مفيدة لبرمجة JavaScript للجميع.