Referensi Software

Menyembunyikan Image Pada Read More Otomatis

image Menjawab pertanyaan sobat alhadi pada postingan revisi read more dan slider pada soft template, yang menanyakan bagaimana cara menghapus read more yang berupa gambar pada template, atau merubah read more berupa gambar menjadi read more text. Dari pertanyaan itu, mungkin yang di maksud adalah menyembuyikan image atau gambar pada read more otomatis sebelum tampil pada halaman penuh.

Jika sobat sudah membaca postingan saya tentang membuat read more otomatis, maka sobat akan menemukan kode script seperti berikut :

<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px; visibility:hidden; display:none"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

kode yang berwarna merah adalah kode yang baru saya tambahkan, kode tersebut berfungsi untuk membuat image tidak tampil pada halaman postingan sebelum read more di klik sampai tampil pada halaman penuh.

Selamat mencoba !

source:
http://miscah.blogspot.com/2010/03/menyembunyikan-image-pada-read-more.html

Subscribe My Blog

Comments