الاسم: تقنية فيس وتويتر وجوجل ويوتيوب من صنعي --- أسلوب جديد
الوصف: ( كود بجوار بنر المنتدى على اليمين وصلات للفيس وتويتر وجوجل ويوتيوب )
المعاينة :


المعلومات : تتكون هذه التقنية من كودين الاول CSS و الثاني HTML

الكود الاول

CSS

الكود:

/*--- فيس  وتويتر وجوجل ويوتيوب من صنعي --- أسلوب جديد-------*/
#advertise{
  margin: auto;
}
 .adss { list-style:none; margin-top:5px auto; margin: 0 1px 2px 1px; display:inline-block; text-align: center; }
 .adss a { display:block; width:81px; height:80px; padding-right:0px; padding-top: 3px; position:relative; text-decoration:none; }
 .adss a strong { font-weight:normal; position:absolute; left:1px; top:-1px; color:#fff; padding:3px; z-index: 999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0, 0.7); -moz-border-radius:20px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);}
 .adss img { max-height: 84px; max-width: 84px; }
 #adsanime:hover { opacity:0.2; }
 #adsanime a strong {
    -webkit-transition-property: opacity;
     -webkit-transition-duration: 800ms;
     -moz-transition-property: opacity;
      -moz-transition-duration: 800ms; }
 #adsanime a strong {
   opacity:0;
    -webkit-transition-property: opacity, top;
     -webkit-transition-duration: 800ms;
      -moz-transition-property: opacity, top;
       -moz-transition-duration: 800ms; }
 #adsanime {
    opacity:0.5;
     -webkit-transition-property: opacity, top;
      -webkit-transition-duration: 800ms;
       -moz-transition-property: opacity, top;
        -moz-transition-duration: 800ms; }
 #adsanime:hover { opacity:1; }
 #adsanime:hover a strong { opacity:1; top:-23px; }

#adsanime img:hover 
{    transform:rotate(-10deg);  
  -ms-transform:rotate(-10deg);   
  -moz-transform:rotate(-10deg);  
  -webkit-transform:rotate(-10deg);  
  -o-transform:rotate(-10deg);}
#adsanime img 
{  vertical-align: middle; 
  max-height: 70px;  
  transition-duration: 100ms;  
  -moz-transition-duration: 100ms;  
  -o-transition-duration: 100ms;  
  -webkit-transition-duration: 100ms;} 


/*------ 7opelward (sasa designe) --------*/


طريقة التركيب 
لوحة الادارة  >>  مظهر المنتدى >> ألوان >> ورقة تصميم ال css

HTML CODE

الكود:

 
<!--                       فيس وتويتر وجوجل ويوتيوب                        -->                                    
<!--                          sasa designe                          --> 
<div style="RIGHT:30px; OVERFLOW: visible; WIDTH:50px; POSITION: absolute; TOP: 30px; HEIGHT: 20px">
                        
   <div id="adsanime" class="adss">
                               <a target="_blank" rel="nofollow" href="https://twitter.com/?lang=ar"><img src="http://i39.servimg.com/u/f39/15/94/01/79/twitte10.png" /> <strong>تويتر</strong></a>                        
   </div>
                                                 
   <div id="adsanime" class="adss">
                               <a target="_blank" rel="nofollow" href="https://plus.google.com/u/1/?tab=XX"><img src="http://i39.servimg.com/u/f39/16/61/91/38/google10.png" /> <strong>جوجل</strong></a>                        
   </div>
                                                 
   <div id="adsanime" class="adss">
                               <a target="_blank" rel="nofollow" href="https://www.youtube.com/channel/UCsEW1rhvfjORn8yxoymC-EQ"><img src="http://i39.servimg.com/u/f39/15/54/04/99/youtub10.png" /> <strong>يوتيوب</strong></a>                        
   </div>
                                                 
   <div id="adsanime" class="adss">
                               <a target="_blank" rel="nofollow" href="https://www.facebook.com/7opelward"><img src="http://i39.servimg.com/u/f39/15/54/04/99/facebo10.png" /> <strong>فيس </strong></a>                        
   </div>
                                                   
   <!--           7opelward          -->

 


كيفية وضع الكود 
يوضع الكود في أي مكان يقبل لغة HTML 

ملاحظات هامة 


إبحث في الكود عن الروابط التالية وضع الروابط الخاصة بك 

SASA DESIGNE كتب:
https://www.youtube.com/channel/UCsEW1rhvfjORn8yxoymC-EQ
https://www.facebook.com/7opelward
https://plus.google.com/u/1/?tab=XX
https://twitter.com/

أرجو نقل الموضوع للمكان المناسب  

مرحبا عزيزي

ضع الشروحات والاكواد  إرسال أكواد أو شروحات 

القسم للاقتراحات وموضوعك مخالف يغلق