Sosyal İmleme Kodları -Java Script

<style>
.bookmark{width:540px;float:left;margin:10px 0px;display:block;}
.bookmark a{float:left;display:block;width:70px;height:29px;overflow:hidden;background:url(http://img.webme.com/pic/c/catlak-site55/bookmark.png);}

</style>



<div class=bookmark>

<a onmouseover="this.style.backgroundPosition='0px 0px';" onmouseout="this.style.backgroundPosition='0px -41px';" href="http://www.facebook.com/share.php?u=http://www.dersmatik.yetkinforum.com" target=_blank style="background-position:0px -41px;"></a>
<a onmouseover="this.style.backgroundPosition='-70px 0px';" onmouseout="this.style.backgroundPosition='-70px -41px';" href="http://twitter.com/home?status=http://www.dersmatik.yetkinforum.com" target=_blank style="background-position:-70px -41px;"></a>
<a onmouseover="this.style.backgroundPosition='-140px 0px';" onmouseout="this.style.backgroundPosition='-140px -41px';" href="http://www.google.com/bookmarks/mark?op=add&bkmk=http://www.dersmatik.yetkinforum.com&title=catlak-site55" target=_blank style="background-position:-140px -41px;"></a>
<a onmouseover="this.style.backgroundPosition='-210px 0px';" onmouseout="this.style.backgroundPosition='-210px -41px';" href="http://del.icio.us/post?url=http://www.dersmatik.yetkinforum.com&title=Dersmatik" target=_blank style="background-position:-210px -41px;"></a>
<a onmouseover="this.style.backgroundPosition='-280px 0px';" onmouseout="this.style.backgroundPosition='-280px -41px';" href="http://www.friendfeed.com/share?title=Catlak-site55&link=http://www.dersmatik.yetkinforum.com" target=_blank style="background-position:-280px -41px;"></a>
<a onmouseover="this.style.backgroundPosition='-350px 0px';" onmouseout="this.style.backgroundPosition='-350px -41px';" href="http://www.myspace.com/Modules/PostTo/Pages/?u=http://www.dersmatik.yetkinforum.com&t=Dersmatik" target=_blank style="background-position:-350px -41px;"></a>

</div>

<style type="text/css">
.stack { position: fixed; bottom: 28px; right: 40px; font: 13px "Trebuchet MS", Verdana, Helvetica, sans-serif; color: #666; }
.stack * { margin: 0; padding: 0; }
.stack > img { position: relative; cursor: pointer; padding-top: 20px; z-index: 2; }
.stack ul { list-style: none; position: absolute; top: 5px; margin:0; cursor: pointer; z-index: 1; }
.stack ul li { position: absolute; }
.stack ul li img { border: 0; }
.stack ul li span { display: none; }
.stack .openStack li span {    
   display: block;
   position: absolute;
   top: 17px;
   right: 60px;
    height: 14px;   
   line-height: 14px;
   background-color:#000;
    border: 0;   
   padding: 3px 10px;   
    text-align: center;
   text-shadow: #000 1px 1px 1px;
    font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
    font-size: 12px;
   color: #fcfcfc;   
    border-radius: 10px;   
   opacity: .85;
   filter: alpha(opacity = 85);
    -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
}

/* IE Fixes */
.stack { _position: absolute; }
.stack ul { _z-index:-1; _top:-15px; }
.stack ul li { *right:5px; }
</style>




<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script> <script type="text/javascript">
$(function () {
   // Stack initialize
   var openspeed = 300;
   var closespeed = 300;
   $('.stack>img').toggle(function(){
      var vertical = 0;
      var horizontal = 0;
      var $el=$(this);
      $el.next().children().each(function(){
         $(this).animate({top: '-' + vertical + 'px', left: horizontal + 'px'}, openspeed);
         vertical = vertical + 55;
         horizontal = (horizontal+.75)*2;
      });
      $el.next().animate({top: '-50px', left: '10px'}, openspeed).addClass('openStack')
        .find('li a>img').animate({width: '45px', marginLeft: '9px'}, openspeed);
      $el.animate({paddingTop: '0'});
   }, function(){
      //reverse above
      var $el=$(this);
      $el.next().removeClass('openStack').children('li').animate({top: '70px', left: '-10px'}, closespeed);
      $el.next().find('li a>img').animate({width: '40px', marginLeft: '0'}, closespeed);
      $el.animate({paddingTop: '35px'});
   });
   
   // Stacks additional animation
   $('.stack li a').hover(function(){
      $("img",this).animate({width: '56px'}, 100);
      $("span",this).animate({marginRight: '30px'});
   },function(){
      $("img",this).animate({width: '50px'}, 100);
      $("span",this).animate({marginRight: '0'});
   });
});
</script>
<div class="stack addthis_toolbox">
    <img src="http://img.webme.com/pic/c/catlak-site55/stack.png"width=40 alt="stack"/>

    <ul id="stack" class="custom_images">
        <li><a class="addthis_button_facebook"><span>Facebook</span><img src="http://img.webme.com/pic/c/catlak-site55/facebook.png"width=40 alt="Share to Facebook" /></a></li>
        <li><a class="addthis_button_stumbleupon"><span>StumbleUpon</span><img src="http://img.webme.com/pic/c/catlak-site55/stumbleupon.png"width=40 alt="Stumble It" /></a></li>
        <li><a class="addthis_button_reddit"><span>Reddit</span><img src="http://img.webme.com/pic/c/catlak-site55/reddit.png"width=40 alt="Share to Reddit" /></a></li>
        <li><a class="addthis_button_digg"><span>Delicious</span><img src="http://img.webme.com/pic/c/catlak-site55/digg.png"width=40 alt="Share to Digg" /></a></li>
        <li><a class="addthis_button_more"><span>Paylaş...</span><img src="http://img.webme.com/pic/c/catlak-site55/addthis.png"width=40 alt="More..." /></a></li>

    </ul>
</div>   
 

 <script language="javascript" src="http://kod.anime.web.tr/bookmark.js"></script><noscript><a href="htpp://www.dersmatik.yetkinforum.com">Sitene Ekle</a></noscript>