Rumah  >  Artikel  >  hujung hadapan web  >  Cara menggunakan js untuk mengendalikan atribut css untuk mencapai pengembangan dan kesan penutupan kemahiran div layer_javascript

Cara menggunakan js untuk mengendalikan atribut css untuk mencapai pengembangan dan kesan penutupan kemahiran div layer_javascript

WBOY
WBOYasal
2016-05-16 16:00:011395semak imbas

Contoh dalam artikel ini menerangkan cara menggunakan js untuk mengendalikan atribut css untuk mencapai kesan pengembangan dan penutupan lapisan div. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Saya baru-baru ini mempelajari JavaScript dan berhubung dengan operasi JS pada sifat CSS, jadi saya menulis kesan kembangkan dan tutup, dan pada masa yang sama merealisasikan penukaran teks butang, yang sangat mudah! Objek Js ini mengendalikan atribut css untuk mencapai kesan pengembangan dan penutupan lapisan div. Kongsi kod dengan pereka bahagian hadapan JS.

<title>js操作div展开关闭</title>
<style>
  #jb51 { border: solid 1px #EEE; 
    background:#F7F7F7; 
    margin:20px; 
    padding:10px; 
    display:none;
    width:300px;    
  }
</style>
<input style="cursor:pointer" onclick="show('jb51');"
type='button' value='展开' id='inp'>
<div id="jb51">脚本之家提供编程源码、网站源码、网页素材、
书籍教程、网站模板、网页特效代码等!</div>
<script>
function show(id){
  var aiin = document.getElementById(id);
  var inp= document.getElementById('inp');
  if(aiin.style.display != 'block'){
    aiin.style.display = 'block';
    inp.value='关闭';
  }else{
    aiin.style.display = 'none';  
    inp.value='展开';
  }
}
</script>

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