Bir Div Bloğunu Gizleme/Gösterme Özelliği
Web sayfalarında bazen bazı resimlerin veya tabloların gizlenmesini istiyebilirsiniz. Sayfanızda büyük bir resim olduğunu düşünün. Bu resmi sayfa ilk gösterildiği zaman görüntelemeyebilirsiniz. Kullanıcı göster link'ine tıklayınca resim gözükür hale gelir. Gizlemek içince gizle link'ine tıklar. Yine bazı sayfalarda örnek kodlar gizlenebilir. Kullanıcı göster linkini tıklanınca kod gösterilir. Bazı siteler bunun yerine bir link koyuyor. Bu link tıklandığında resim veya kod parçası popup yöntemi ile resim açma pencerede gösteriliyor. Popuplarla uğraşmak hoş olmuyor.
Kodlar:
Kodlar:
<html> <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript"> function hide(id){ var divObject=document.getElementById(id); divObject.style.display="none"; } function show(id){ var divObject=document.getElementById(id); divObject.style.display="block"; } </SCRIPT> <body> <table><tr><td><a href="javascript:hide('test')">Gizle</a></td><td><a href="javascript:show('test')">Göster</a></td></tr></table> <div id="test"><img src="test.gif"></img><br>Burada hem resim var hem yazı. Burada hem resim var hem yazı Burada hem resim var hem yazı Burada hem resim var hem yazı Burada hem resim var hem yazı Burada hem resim var hem yazı Burada hem resim var hem yazı Burada hem resim var hem yazı</div> </body> </html>
Yukardaki kod içinde düzenlenecek olan kısımlar;
id="test" kısmına eklicek olduğunuz yazının veya resmin id'sini ekliceksiniz.
src="test.gif" buraya ise gösterilecek resim veya gif resmin linki eklenecek.
Bizi Takip Edin
Pinterest Facebook Twitter
© by bilgicafem61
Aşağıda Yorum ve Sorularınızı Bırakın.
Yorum Gönder Blogger Facebook