اضافة المشاركات الشائعة بشكل جميل جدا

السلام عليكم

اضافه تعرض المشاركات بمظهر رآئع وجميل

الشرح :

1- نقوم باضافة اداة ونختار من القائمه المشاركات الشائعه

ثم حفظ .

2- نعود مره اخرى باضافة اداة ونختار الجافاسكريبت

ونقوم بلصق الكود ادناه في المربع ثم نحفظ الاداه

}
.popular-posts  {
    /* recommended styles for kwicks ul container */
    list-style: none;
    position: relative;
    margin: 0;
    padding: 0;
}
.popular-posts  li{
    /* these are required, but the values are up to you (must be pixel) */
    width: 185px;
    height: 363px;
    /*do not change these */
    display: block;
    overflow: hidden;
    padding: 0px;  /* if you need padding, do so with an inner div (or implement your own box-model hack) */
}
.fadeout {
  display: block;
  position: absolute;
  right: 0px;
  width: 300px;
  height: 365px;
  z-index: 4;
  background: url(overlay.png) repeat-y scroll top right;
}
.popular-posts  li {
    /* This is optional and will be disregarded by the script.  However, it should be provided for non-JS enabled browsers. */
    margin-right: -4px; /*Set to same as spacing option. */
    float: left;
}
.popular-posts .item-title {
  background: #182424   !important;
  color: #fff;
  opacity: 0.77;
  filter:alpha(opacity=77);
  position: absolute;
  padding: 10px;
  top: 60px;
}

.popular-posts .item-title a:visited{
  color: #fff;
  font-size:16px;
  text-transform:uppercase;

}

.popular-posts  .item-snippet{
  background: #182424;
  color: #fff;
  opacity: 0.77;
  filter:alpha(opacity=77);
  position: absolute;
  padding: 10px;
  top: 215px;
  height:127px;

}
.popular-posts  img {
  margin: 0  !important;
  padding:0  !important;
  border: 3px;
  width:600px;
  height:363px;
}

.popular-posts  li a {
  margin: 0  !important;
  padding:0  !important;
  background-color: #182424 !important;

}
.popular-posts  .item-title a {
 opacity: 0.77;
  filter:alpha(opacity=77);
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="http://accordion-template.googlecode.com/svn/trunk/jquerykwick.js"></script>
<script language="JavaScript" type="text/javascript">
/*<![CDATA[*/
$(document).ready(function() {
                    $('.popular-posts ul').kwicks({
                    max : 600,
                    min : 300,
                    spacing : -4,
                    duration: 200
                  });
});
/*]]>*/
</script>

الى اللقاء......ابو هشام الحمداني

اضافة المشاركات الشائعة بشكل جميل جدا

بقلم ابو هشام الحمداني

ليست هناك تعليقات:

إرسال تعليق

تابعنا عبر البريد الالكتروني

جديد موقعنا

تابعنا علىYouTube

أقسام المدونة

اخترنا لكم

اقسام المدونة

مكتبة الفيديو

ابحث في اليوتيوب

المتواجدون الان

اتصل بصاحب الموقع عبر الاميل الشخصي

التبادل الإعلاني

مساحة الاعلانية

مساحة الاعلانية

مساحة اعلانية

مساحة الاعلانية

مساحة الاعلانية

مساحة اعلانية

المتابعون

تابعنا على facebook

تابعنا على twetter

إحصاءيات الموقع

تابع "مدونة طيف"

اضافة المشاركات الشائعة بشكل جميل جدا

بقلم ابو هشام الحمداني

قد يهمك أيضا :

ليست هناك تعليقات:

إرسال تعليق

تابعنا عبر البريد الالكتروني

جديد موقعنا

تابعنا علىYouTube

أقسام المدونة

اخترنا لكم

اقسام المدونة

مكتبة الفيديو

ابحث في اليوتيوب

المتواجدون الان

اتصل بصاحب الموقع عبر الاميل الشخصي

التبادل الإعلاني

مساحة الاعلانية

مساحة الاعلانية

مساحة اعلانية

مساحة الاعلانية

مساحة الاعلانية

مساحة اعلانية

المتابعون

تابعنا على facebook

تابعنا على twetter

إحصاءيات الموقع

تابع "مدونة طيف"