Senin, 21 April 2014

Snippet Syntax for iFrame Attribute

Bagi sobat blogger yang suka bermain dengan objek iframe, AA Koben akan berbagi trik postingan mengenai hal tersebut. Sebelumnya dalam artikel trick style iframe writing, mungkin sudah mewakili ;) Satu hal yg perlu di ingat trick ini akan berjalan kalau web tujuan tidak memasang kode anti iframe :D
Mari kita mulai dari yg sederhana...
<iframe src="about:blank" name="myFrame" width="100%" height="350" scrolling="auto" frameborder="0"></iframe>
<form action="http://www.bing.com/search" target="myFrame">
<input type="text" name="q" />
<input type="submit" value="Go!" />
</form>
Silahkan isi link target (action) seduai dengan kebutuhan. Untuk memudahkan proses, bagi kalian yg sudah mempunyai html editor silahkan buka! Bagi yg belum punya silahkan buka live HTML editor Kemudian masukan bumbu-bumbu berikut pada kotak sebelah kiri, dilanjutkan dengan memencet tombol Preview.
<script type="text/javascript">
function setVisibility() {
document.getElementById('iframe1').style.display = "block";
}
</script>
<style type="text/css">
#iframe1 {
display:none;
}
</style>
<noscript>
<style type="text/css">
#iframe1 {
display:block;
}
</style>
</noscript>
<iframe src="about:blank" name="myFrame" width="100%" height="350" scrolling="auto" frameborder="1" id="iframe1"></iframe>
<form action="http://www.bing.com/search" target="myFrame">
Search: <input type="text" name="q"> <input type="submit" value="Go!" name="type" onclick="setVisibility();">
</form>

<script language="javascript">
function LoadPage(){
var objFrame=document.getElementById("myFrame");
objFrame.src=document.getElementById("URL").value;
}
</script>
<div align="center">
<form action="http://www.google.com/custom" target="myFrame">
<input type="text" name="q" size="45"> <input type="submit" value="Search">
</form>
<iframe src="about:blank" name="myFrame" width="100%" height="350" scrolling="auto" frameborder="0"></iframe>
<input type="button" value="&lt;&lt; Back" onClick="myFrame.history.back()" title="Go back one page"> <input type="button" value="Forward &gt;&gt;" onClick="myFrame.history.forward()" title="Go forward one page">
</div>

<script type="text/javascript">
function setVisibility() {
document.getElementById('iframe1').style.display="block";
}
</script>
<style type="text/css">
#iframe1 {
display:none;
}
</style>
<iframe src="about:blank" name="myFrame" width="100%" height="350" scrolling="auto" frameborder="0" id="iframe1"></iframe>
<form action="http://www.google.com/custom" target="myFrame">
Search: <input type="text" name="q"> <input type="submit" value="Go!" name="type" onclick="setVisibility();">
</form>

Happy iframe \m/

Tidak ada komentar:

Posting Komentar