Rumah > Artikel > hujung hadapan web > JS melaksanakan kod pengiklanan sebelah kiri yang boleh diklik untuk mengembangkan dan menutup kemahiran javascript

JS melaksanakan kod pengiklanan sebelah kiri yang boleh diklik untuk mengembangkan dan menutup kemahiran javascript

WBOYasal: 2016-05-16 15:40:571173semak imbas

Contoh dalam artikel ini menerangkan pelaksanaan JS bagi kod pengiklanan sebelah kiri yang boleh diklik untuk mengembangkan dan menutup. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Apa yang diperkenalkan di sini ialah pelaksanaan JS kod pengiklanan sebelah kiri yang boleh diklik untuk mengembangkan dan menutup pada halaman web Prestasinya serupa dengan iklan berpasangan, tetapi kaedah operasinya berbeza tersembunyi di sebelah kiri skrin, tetapi ia tidak tersembunyi sepenuhnya. Paparkan iklan dengan bar imej menegak, dan apabila anda mengklik "Paparkan", ia akan membuka semula iklan jenis ini boleh meningkatkan pengalaman pengguna laman web.

Tangkapan skrin kesan berjalan adalah seperti berikut:

Alamat demo dalam talian adalah seperti berikut:

http://demo.jb51.net/js/2015/js-click-show-close-style-adv-codes/

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>
<title>网页上可点击展开、关闭的左侧广告代码</title>
</head>
<body>
<div id="Bar1190_big" style="position:absolute;z-index:9;top:10px;left:0px;width:100px;height:300px;">
<div id="AD1190" style="width:100px;height:300px;text-align:center;float:none" class="adSpace">
<a href="#" target="_blank"><img width="100" height="300" src="images/2401.jpg" alt="" border="0"></a>
</div>
<div style="height:18px;width:100px;background:#CCCCCC;text-align:right;line-height:18px;">
<a style="font-size:12px;cursor:pointer;" onClick="bar1190_hidden()">关 闭</a> 
</div>
</div>
<div id="Bar1190_small" style="position:absolute;z-index:9;top:10px;display:none;left:0px;width:20px;height:300px;">
<div id="AD1190" style="width:20px;height:300px;text-align:center;float:none" class="adSpace">
<a href="#" target="_blank"><img width="25px" height="300" src="images/2402.jpg" alt="" border="0"></a>
</div>
<div style="height:18px;width:25px;background:#CCCCCC;text-align:right;line-height:18px;">
<a style="font-size:12px;cursor:pointer;" onClick="bar1190_show()">展开</a>
</div>
</div>
<script type="text/javascript">
function bar1190_show(){
document.getElementById('Bar1190_big').style.display='';
document.getElementById('Bar1190_small').style.display='none';
}
function bar1190_hidden(){
document.getElementById('Bar1190_big').style.display='none';
document.getElementById('Bar1190_small').style.display='';
}
var autohide1190 = setTimeout("bar1190_hidden()",6000);
</script>
</body>
</html>

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.

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：jquery melaksanakan kod_jquery pengiklanan undur yang boleh ditutup kesan khasArtikel seterusnya：jquery melaksanakan kod_jquery pengiklanan undur yang boleh ditutup kesan khas

Artikel berkaitan

Lihat lagi