محمود طلعت
الإدارة العَـامّـة
هوايتے : عمليے و ترفيهيے : جنسيے : مزاجيے : مشاركاتيے : 336 نقآطيے : 10010949 ميلاديے : 07/09/1980
التايم التوقيت:
| موضوع: كود ايقونات المواقع الاجتماعية مع الانزلاق وتاثير الجي كويري الأحد يناير 01, 2012 9:21 am | |
| كود ايقونات المواقع الاجتماعية مع الانزلاق وتاثير الجي كويري
ا صورة للكود ا
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
الكود
- الكود:
-
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'> jQuery(function() { jQuery('#navigation a').stop().animate({'marginLeft':'-20px'},1000); jQuery('#navigation > li').hover( function () { jQuery('a',jQuery(this)).stop().animate({'marginLeft':'-2px'},100); }, function () { jQuery('a',jQuery(this)).stop().animate({'marginLeft':'-20px'},1000); } ); }); </script>
<style type="text/css"> ul#navigation { position: fixed; margin: 0px; padding: 0px; top:30px; left: 0px; list-style: none; z-index:9999; } ul#navigation li { width: 32px; } ul#navigation li a { display: block; margin-left: -2px; margin-top: 4px; width: 32px; height: 32px; background-color:#FFFFFF; background-repeat:no-repeat; background-position:center center; border:1px solid #AFAFAF; -moz-border-radius:0px 5px 5px 0px; -webkit-border-bottom-right-radius: 5px; -webkit-border-top-right-radius: 5px; -khtml-border-bottom-right-radius: 5px; -khtml-border-top-right-radius: 5px; /*-moz-box-shadow: 0px 4px 3px #000; -webkit-box-shadow: 0px 4px 3px #000; */ opacity: 0.6; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60); } ul#navigation li a:hover {opacity: 1; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);} ul#navigation .feed a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/1140.png); } ul#navigation .facebook a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/263.png); } ul#navigation .twitter a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/344.png); } ul#navigation .tuenti a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/419.png); } ul#navigation .youtube a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/518.png); } </style>
[/b][b] <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'> jQuery(function() { jQuery('#navigation a').stop().animate({'marginLeft':'-20px'},1000); jQuery('#navigation > li').hover( function () { jQuery('a',jQuery(this)).stop().animate({'marginLeft':'-2px'},100); }, function () { jQuery('a',jQuery(this)).stop().animate({'marginLeft':'-20px'},1000); } ); }); </script>
<style type="text/css"> ul#navigation { position: fixed; margin: 0px; padding: 0px; top:30px; left: 0px; list-style: none; z-index:9999; } ul#navigation li { width: 32px; } ul#navigation li a { display: block; margin-left: -2px; margin-top: 4px; width: 32px; height: 32px; background-color:#FFFFFF; background-repeat:no-repeat; background-position:center center; border:1px solid #AFAFAF; -moz-border-radius:0px 5px 5px 0px; -webkit-border-bottom-right-radius: 5px; -webkit-border-top-right-radius: 5px; -khtml-border-bottom-right-radius: 5px; -khtml-border-top-right-radius: 5px; /*-moz-box-shadow: 0px 4px 3px #000; -webkit-box-shadow: 0px 4px 3px #000; */ opacity: 0.6; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60); } ul#navigation li a:hover {opacity: 1; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);} ul#navigation .feed a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/1140.png); } ul#navigation .facebook a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/263.png); } ul#navigation .twitter a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/344.png); } ul#navigation .tuenti a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/419.png); } ul#navigation .youtube a { background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/518.png); } </style>
<ul id="navigation"> <li class="feed"><a href="http://[url=http://[url=http://www.sidiamer.com/feed/%22%5Dwww.sidiamer.com/feed/%22%5B/url%5D]www.sidiamer.com/feed/%22]www.sidiamer.com/feed/"[/url][/url] target="blank" title="Feed RSS"></a></li> <li class="facebook"><a href="#" target="blank" title="Facebook"></a></li> <li class="twitter"><a href="http://twitter.com/#" target="blank" title="Twitter"></a></li> <li class="tuenti"><a href="http://[url=http://[url=http://www.tuenti.com/#%22]www.tuenti.com/#%22[/url]]www.tuenti.com/#%22]www.tuenti.com/#"[/url][/url] target="blank" title="Tuenti"></a></li> <li class="youtube"><a href="http://[url=http://[url=http://www.youtube.com/user/#%22]www.youtube.com/user/#%22[/url]]www.youtube.com/user/#%22]www.youtube.com/user/#"[/url][/url] target="blank" title="Youtube"></a></li> </ul>
| |
|