ملحوظة: لقد تم إغلاق باب التبادل الإعلانى البنرى حتى إشعار آخر .
الثلاثاء، 12 نوفمبر 2013

إضافة أخر المواضيع بشكل مميز مع مصغرات الصور

اليوم من مدونة ابداعاتى اقدم لكم شرح فى غاية السهولة والبساطة لإضافة أخر المواضيع فى مدونات بلوجر بشكل بسيط وجميل وخفيف جدا فى التحميل وهو عبارة عن مصغرات لصور أخر المواضيع عند الوقوف بالماوس على صورة أى موضوع يظهر اسم الموضوع كما بالصورة أعلاه 

والأن مع شرح التركيب
اذهب إلى لوحة تحكم مدونتك > التخطيط > إضافة أداة > Html/javascript 
ضع بها الكود التالى
<style text-type="CSS">
img.label_thumb {float:right;padding:2px;background:#fff;border:1px solid #000;width:78px;height:78px;margin-right:10px;margin-top:5px;margin-bottom:5px; }
img.label_thumb:hover {opacity:0.8;filter:alpha(opacity=80);-moz-opacity:0.80;-khtml-opacity:0.8 }
</style>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json){document.write('<div>');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}
var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
{s=entry.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=d;}
else thumburl='';}
document.write('<a href="'+posturl+'" title="'+posttitle+'"><img class="label_thumb" src="'+thumburl+'"/></a>');
if(i!=(numposts-1))
document.write('');}
document.write('</div>');}
//]]>
var numposts = 9;
</script>
<script type="text/javascript" src="http://myebd3at.blogspot.com/feeds/posts/default?alt=json-in-script&callback=labelthumbs"></script>


طريقــــــة التنسيق

 width:78px عرض الصور المصغرة

 height:78px ارتفاع الاضافــــــــــــــة

var numposts = 9 هو عدد المواضيع 

جديد : الأن يمكنك التحرك بسلاسة بين المواضيع السابقة واللاحقة عبر (الكيبورد) بالضغط على الزر الأيمن والأيسر

0 التعليقات:

إرسال تعليق