Bài liên quan ảnh thu nhỏ


Ảnh demo

<style type='text/css'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
ul#related-posts{font:bold 12px Arial;list-style:none;text-transform:none;margin:-15px 0px;padding:0 0 20px}
ul#related-posts li{float:left;height:auto;list-style-type:none;margin:0 5px;padding:2px 1px}
*html ul.rp#related-posts li{margin:0 13px}
ul#related-posts li a{-moz-box-shadow:0 1px 2px rgba(0,0,0,0.15);border:2px solid #999;display:block;height:90px;position:relative;width:90px;color:#eaeaea;text-decoration:none;text-shadow:0 1px 0 #000}
ul#related-posts li .overlay{height:84px;line-height:16px;position:absolute;width:84px;z-index:10;padding:6px 0 0 6px}
ul#related-posts li a:hover .overlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTzDC4SZL5Jqcvx_KPXLjC7TFr68oDruBXe09wFqEC0cni2MDXc5JEY6VhRZl6Nl-NE0OjjL6Z292bZqb3BhVJZkoEWI41miDhuONpgXzjLnLIfedqtXwOi0AyRXfN3T815dv1VRHAzYM/s1600/transparant.png);display:block!important;}
ul#related-posts li img{bottom:0;padding:0!important}
ul#related-posts li a:hover{-moz-box-shadow:0 1px 3px rgba(0,0,0,0.25)}
</b:if>
</style>
-----------
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<h2 class='banner-1' style='font-size:1.5em;border-bottom:2px solid #ff0000;width:205px;padding:20px 0px 0px 0px'>Mẫu tương tự</h2>
<script type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUHdElj-p25dfnb0ycwtPQwVCh_tZzFsXaZe3QABfkCbYnDnVriV49oOFqGhAOqzfSLkGOvwU3R3Gk2V1h7dm-W-S515p_DbqCdm7zAmsduSH7jgmbaagZPsM8UaYHVMwr4vZn3ywl-Wk/s1600/no+image.jpg&quot;;
var maxresults=3;
</script>
<script type='text/javascript'>
//<![CDATA[
var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();var thumburl=new Array();function related_results_labels_thumbs(h){for(var g=0;g<h.feed.entry.length;g++){var j=h.feed.entry[g];relatedTitles[relatedTitlesNum]=j.title.$t;try{thumburl[relatedTitlesNum]=j.media$thumbnail.url}catch(f){s=j.content.$t;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl[relatedTitlesNum]=d}else{if(typeof(defaultnoimage)!=="undefined"){thumburl[relatedTitlesNum]=defaultnoimage}else{thumburl[relatedTitlesNum]="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga9T2qBszZLfYNL7Qmla8Us_qJIn0hniBUOyU8lpsbYo1BU2q-Mh6SDqDfo_McKOukROnj6i3LDViiU36XJn-O-Wfqg7vB38SVFP4Tz1vn9pd1N9E4o8UbfwmF3m_PfNcXY2bh7Qt47Hc/s400/noimage.png"}}}if(relatedTitles[relatedTitlesNum].length>35){relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0,35)+"..."}for(var e=0;e<j.link.length;e++){if(j.link[e].rel=="alternate"){relatedUrls[relatedTitlesNum]=j.link[e].href;relatedTitlesNum++}}}}function removeRelatedDuplicates_thumbs(){var g=new Array(0);var h=new Array(0);var f=new Array(0);for(var e=0;e<relatedUrls.length;e++){if(!contains_thumbs(g,relatedUrls[e])){g.length+=1;g[g.length-1]=relatedUrls[e];h.length+=1;f.length+=1;h[h.length-1]=relatedTitles[e];f[f.length-1]=thumburl[e]}}relatedTitles=h;relatedUrls=g;thumburl=f}function contains_thumbs(f,h){for(var g=0;g<f.length;g++){if(f[g]==h){return true}}return false}function printRelatedLabels_thumbs(h){var e;if(typeof(splittercolor)!=="undefined"){e=splittercolor}else{e="#d4eaf2"}for(var f=0;f<relatedUrls.length;f++){if((relatedUrls[f]==h)||(!relatedTitles[f])){relatedUrls.splice(f,1);relatedTitles.splice(f,1);thumburl.splice(f,1);f--}}var g=Math.floor((relatedTitles.length-1)*Math.random());var f=0;if(relatedTitles.length>0){document.write('<ul id="related-posts">')}while(f<relatedTitles.length&&f<20&&f<maxresults){document.write("<li><a");document.write(' href="'+relatedUrls[g]+'"><span class="overlay" style="display:none;">'+relatedTitles[g]+'</span><img style="width:90px;height:90px;border:0px;" src="'+thumburl[g]+'"/></a></li>');f++;if(g<relatedTitles.length-1){g++}else{g=0}}document.write("</ul>");relatedUrls.splice(0,relatedUrls.length);thumburl.splice(0,thumburl.length);relatedTitles.splice(0,relatedTitles.length)};
//]]></script>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/>
</b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</b:if>