this.screenshotPreview = function(){
  /* CONFIG */

    xOffset = 20;
    yOffset = 50;

    // these 2 variable determine popup's distance from the cursor
    // you might want to adjust to get the right result

  /* END CONFIG */
  
  $("a.screenshot").hover(function(e){
    this.t = this.title;
    this.title = "";
    var c = (this.t != "") ? "<br/>" + this.t : "";
    $("body").append("<p id='screenshot'><img src='images/"+ this.rel +"' alt='url preview' />"+ c +"</p>");
    $("#screenshot")
      .css("top",(e.pageY - xOffset) + "px")
      .css("left",(e.pageX + yOffset) + "px")
      .fadeIn("fast");
    },
  function(){
    this.title = this.t;
    $("#screenshot").remove();
    });
  $("a.screenshot").mousemove(function(e){
    $("#screenshot")
      .css("top",(e.pageY - xOffset) + "px")
      .css("left",(e.pageX + yOffset) + "px");
  });
};

$(document).ready(function(){

  screenshotPreview();
  
// Change appearance of the social media icons
  $('ul#social li a').css('opacity','0.4');

  $('ul#social li a').mouseenter(function(){
        $(this).stop().animate({ marginTop: "-10px" }, 100);
        $(this).fadeTo(100, 1.0);
    });

    $('ul#social li a').mouseleave(function(){
        $(this).stop().animate({ marginTop: "0px" }, 100);
        $(this).fadeTo(100, 0.4);
    });


  });

