الوجهة موقع ب ndiex

SATDJATV · 2015-01-04, 20:07

مرحبا بكل أعضاء و وزوار منتديات

متتبعي قسم تطوير المواقع و المنتديات

إخوتي في الله يسعدني كثيرا شغفكم و متابعتكم لجديد شروحاتي في هذا القسم

أما بعد , لي شرف أن أمتعكم بجديد السكريبتات و أفضلها على الساحة العالمية , شرحنا اليوم متمثل في سكريبت لشبكة إجتماعية تنافس في كل من الفايسبوك و التويتر..يتمتع هذا الأخير بعديد الإمتيازات كإضافة الصور,الشات,الفيديوهات و الكثير من ذلك
index الوجهة موقع ب

لن اطول

كود بلغة HTML:

<!DOCTYPE HTML>
    <!--  DESGiN AND CODED fox4host.com  -->
<html>

<head>
 <**** charset="utf-8" />
  <title>شبكة عين الريش لكل الجزائريين و العرب</title>
</head>
   <!--  DESGiN AND CODED fox4host.com  -->
<body>
 <style type="text/css">

 @font-face{
    font-family: a ;
    src:url('font/JF Flat regular.ttf ')


 }


 body{
  background: url(img/bg.png) repeat ;
        position: relative;



 }
.logo{
 width:275px;
 height: 178px;
  background: url(img/logo.png) no-repeat ;
  margin:60px auto ;

  opacity:0.4 ;

}
.logo a {
    width:275px;
 height: 178px;
 position:absolute;
 display:block;

}
.logo:hover {
   transition: all 1s ;
    opacity:1.0;
   -moz-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-webkit-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-o-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-ms-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);


}


.t{

 font-family:a;
 text-align: center;
   



}

.t1 {

   font-size: 25px;
  color : #333333   ;
  margin: 0px auto ;
  text-decoration: none ;
     padding: 20px 100px 20px 100px ;
  border: 1px solid #333333 ;
  width: 400px ;
  color : #333333   ;


}

.t1:hover{
  color: #0033CC ;
   border: 1px solid #0033CC ;


}

 .t2{
  font-size: 25px;
  color : #333333   ;
  margin: 0px auto ;
  text-decoration: none ;
     padding: 20px 100px 20px 100px ;
  border: 1px solid #333333 ;
  width: 400px ;
  color : #333333   ;

 }

 .t2:hover{
  color: #AD0000 ;
   border: 1px solid #AD0000 ;


 }

.t3{
 font-size: 25px;
  color : #333333   ;
  text-align: center;
  margin: 40px auto ;
  text-decoration: none ;
     padding: 20px 100px 20px 100px ;
  border: 1px solid #333333 ;
  width: 400px ;
  color : #333333   ;


}

 .t3:hover{
  color: #00CCCC ;
   border: 1px solid #00CCCC ;


 }


.i-bg{
    width:154px;
    height:48px;
    margin:25px auto;
}

.i1{
    width:48px;/* DESGiN AND CODED fox4host.com */
    height:48px;/* DESGiN AND CODED fox4host.com */
    float:right;/* DESGiN AND CODED fox4host.com */

    display:block;

    background:url(img/f.png) no-repeat;

    opacity:0.4;

}
.i1:hover{
    transition: all 1s ;
    opacity:1.0;
   -moz-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-webkit-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-o-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-ms-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
}
.i2{
    width:48px;
    height:48px;
    float:right;
    display:block;
    margin-right:10px;
    background:url(img/t.png)  no-repeat ;
    opacity:0.4;
}
.i2:hover{
     transition: all 1s ;
    opacity:1.0;
   -moz-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-webkit-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-o-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-ms-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);

}
.i3{
    width:48px;
    height:48px;
    float:left;
    display:block;
     margin-left:-10px;
    background:url(img/y.png) no-repeat;
    opacity:0.4;
}
 .i3:hover{
    transition: all 1s ;
    opacity:1.0;
   -moz-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-webkit-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-o-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
-ms-transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
transform: scale(1) rotate(360deg) translateX(0px) skewX(1deg);
}

#t4 {
 font-family: a ;
 color: #333333;
 font-size: 22px;
 margin-bottom: 10px;




}




 </style>


 <!--  DESGiN AND CODED fox4host.com  -->

  <div class="logo">
              <!--  رابط منتداك  -->
     <a  href="https://www.fox4host.com" title="تصميم وتكويد فوكس فور هوست "> </a>

  </div>




<div class="t">
 <a class="t1" href="https://www.ainrich.info/vb/" title="المنتدى"  >المنتدى</a>
  <a class="t2" href="https://www.ainrich.info/wp/" title="المدونة">المدونة</a>


</div>



 <center><p style="text-align: center; margin-bottom: 100px"> <div id="t4">تابعنا عبر</div></p></center>




                  <!--  روابط موقع التواصل الاجتماعى   -->
                                                   <div class="i-bg">
        <a class="i1" href="https://www.********.com" title="تابعنا على الفيس بوك"></a>
        <a class="i2" href="https://www.twitter.com" title="تابعنا على تويتر"></a>
        <a class="i3" href="htttp://www.youtube.com" title="اشترك فى قناتنا"></a>

    </div>
    <!--  DESGiN AND CODED fox4host.com  -->
    <!--  DESGiN AND CODED fox4host.com  -->
    <!--  DESGiN AND CODED fox4host.com  -->



</body>

</html>