Selamat Datang

Membuat Frame Fullscreen Dengan HTML

Membuat frame yang full screen 100% dengan html akan adalah topik kita kali ini, membuat frame yang fullscreen tidak terlalu gampang, tidak cukup sekedar memberikan height 100% dan width 100%.

Frame

Image is under Creative Common by cpradi

Berawal dari sebuah pertanyaan di sebuah group di facebook, dimana seorang bertanya bagaimana membuat Iframe yang fullscreen, maka dengan itu kami berniat membuat sebuah tulisan yang mungkin bisa menjawab pertanyaan tersebut, tulisan ini tidak akan panjang karena membuat nya juga tidak terlalu sulit, hanya perlu sedikit tambahan kode saja.

iframe100

Lalu apa gunanya membuat frame? ada banyak alasan, salah satu alasan biasa digunakan iframe yaitu saat sebuah halaman dipindahkan ke domain baru, tapi user masih mengakses halaman yang lama (sebenarnya bisa di redirect).

Alasan lain yaitu ketika sebuah domain belum siap launching website nya, dan demo website masih diletakan di tempat yang berbeda, maka kadang untuk menampilkannya secara online kepada client, maka developer menggunakan frame. Dan masih banyak alasan lainnya.

Lalu bagimana cara membuatnya?

Pertama siapkan sebuah file HTML yang kita beri nama iframe.html.

Disini kita akan mencoba memuat halaman depan tutorial-webdesign.com dengan file tersebut, berikut ini adalah potongan kode yang bisa digunakan.

Bisa dilihat, kalau anda klik menu-menu yang ada di demo tersebut, url nya tidak berubah, itu menandakan bahwa halaman tersebut dimuat dalam sebuah frame.

Index.html

Letakan script berikut dibawah tag /head.


<frameset rows="*,1" framespacing="0" border="0" frameborder="NO">
	<frame src="http://tutorial-webdesign.com/" name="test" scrolling="auto" noresize>
</frameset>

<noframes>
	<body>
	</body>
</noframes>

Kenapa diletakan setelah tag /head dan tidak didalam tag body dan /body ? Karena begitulah cara penggunaan frame.

Berikut adalah hasil yang telah dibuat

DEMO | Download Code

Sekian tutorial singkat ini, salam web development indonesia





Penulis :

Website yang berisi Tutorial, Tips, Trik, Inspirasi, Opini, Cerita, Studi kasus, dan berbagai hal menarik tentang Web Design, Web Development dan Graphic Design untuk orang-orang kreatif di Indonesia. View all posts by TWD Editorial

Comments

3 thoughts on “Membuat Frame Fullscreen Dengan HTML

  1. Zul Ihsan says:

    Trik ini bisa digunakan di blogspot gak Mas?

  2. Om Kicau says:

    Manteb tutorialnya. Sudah saya cobakan dan berhasil.
    Terima kasih ilmunya.

  3. kebro says:

    Klo untuk blogspot cara nya bagaimana pak?

Leave a Comment

XHTML: You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>


Klik Tombol Like / Suka ya kawan..

Klik tombol "Like" atau "Suka" untuk mendapatkan update tutorial, tips & tricks serta info terbaru seputar dunia web design & development