Download Source Code Aplikasi

Style.Display

Saturday, October 12th, 2019 - Style DOM

Properti style.display dipakai untuk menetapkan kalau atau bagaimana suatu elemen ditampilkan.

Sintaks:

obj.style.display = value;

Nilainya:

  • inline (default)
    Suatu elemen ditampilkan dengan tidak memperoleh perhiasan line break sebelum dan setelahnya.
  • block
    Suatu elemen ditampilkan dengan perhiasan line break sebelum dan setelahnya.
  • list-item
    Suatu elemen ditampilkan dengan perhiasan line break sebelum dan setelahnya, tetapi dengan perhiasan list item marker.
  • none
    Ketika anda ingin menyembunyikan suatu elemen, silahkan set DISPLAY ke nilai none.
  • inherit

Contoh:

<HTML> <HEAD> <TITLE>style.display</TITLE> <STYLE TYPE="text/css"> #mydiv { border: solid black 1px; } </STYLE> </HEAD> <BODY> <DIV ID="mydiv"> <P>Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…</P> <P>Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…</P> <P>Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…</P> </DIV> <BUTTON TYPE="button" ID="mybutton_1" ONCLICK="document.getElementById(‘mydiv’).style.display = ‘none’; document.getElementById(‘mybutton_2’).style.display = ‘block’; this.style.display = ‘none’;">Sembunyikan teks di atas</BUTTON> <BUTTON TYPE="button" STYLE="display: none;" ID="mybutton_2" ONCLICK="document.getElementById(‘mydiv’).style.display = ‘block’; document.getElementById(‘mybutton_1’).style.display = ‘block’; this.style.display = ‘none’;">Munculkan kembali teks di atas</BUTTON> </BODY> </HTML>
Demikian yang dapat kami share kepada sobat source code aplikasi pada kesempatan ini, semoga dapat bermanfaat dan bisa menjadi referensi pemrograman bagi anda. Jangan lupa like Fan Page kami, dan SUBSCRIBE Channel Youtube kami untuk dapatkan update source code aplikasi terbaru.
Download Source Code Aplikasi
Style.Display | Ahmad Code | 4.5