Artikel ini menjelaskan metode JS untuk mengimplementasikan ekspansi dan kontraksi lapisan div di sudut kanan bawah. Bagikan untuk referensi Anda. Metode implementasi spesifik adalah sebagai berikut:
Salinan kode adalah sebagai berikut:
<! Doctype html public "-// w3c // dtd html 4.0 transisi // en">
<Html>
<head>
<meta http-equiv = "konten tipe" content = "text /html; charset = utf-8" />
<title> JS mengimplementasikan lapisan div yang dapat diperluas dan dikontrak di sudut kanan bawah </iteme>
<type style = "text/css">
<!-
*{margin: 0; padding: 0;}
body {text-align: center;}
#main {border: merah 1px padat; lebar: 1000px; tinggi: 1600px; margin: 0 auto;}
#main #scroll {width: 250px; tinggi: 150px; border: hijau 1px padat; text-align: kiri; posisi: absolute; visibilitas: tersembunyi;}
#main #scroll #open {float: left; text-align: center; width: 180px;}
#main #scroll #close {float: right;}
//->
</tyle>
</head>
<body>
<Div id = "Main">
Hanya menerapkan bagian inti, seperti untuk meningkatkan konten sendiri, atau terus mempercantiknya, itu harus bagus!
<div id = "gulir"> <div id = "open" onmouseover = "openbox ()"> <a href = "/" onclick = "openbox ()"> Selamat datang </a> <div id = "tutup"> <marquee align = "left" onmouseover = "stop ()" onmouseout = "start ()"> sumpah sumpu! </sarquee> </div> </div>
<div id = "tutup"> <a href = "#" onclick = "closeBox ()"> tutup </a>
<type skrip = "Teks/JavaScript">
<!-
var scroll = document.geteLementById ("gulir")
var main = document.geteLementById ("main")
var open = document.geteLementById ("open")
var close = document.geteLementById ("close")
scroll.style.visibility = "visible"
function runright ()
{
/*Di sini -4 terutama untuk tampilan yang lebih baik, karena saya mengatur perbatasan*/
scroll.style.top = document.body.scrolltop+document.body.clientheight-scroll.clientheight-4+"px"
scroll.style.left = document.body.scrollleft+document.body.clientwidth-scroll.clientwidth-4+"px"
/*Jalankan fungsi ini sesekali*/
setTimeout ("runright ()", 30)
}
/*Tutup: atur ketinggian yang akan dikurangi*/
function closeBox ()
{
scroll.style.height = scroll.offsetheight-4+"px"
if (scroll.offsetheight> 20)
{
setTimeout ("closeBox ()", 5)
}
kalau tidak
{
close.style.visibility = "tersembunyi"
}
}
fungsi openbox ()
{
if (scroll.offsetheight <148)
{
close.style.visibility = "visible"
scroll.style.height = scroll.offsetheight+2+"px"
setTimeout ("OpenBox ()", 5)
}
}
runright ();
//->
</script>
</div>
</div>
</div>
</body>
</html>
Saya harap artikel ini akan membantu pemrograman JavaScript semua orang.