Question

Simple question, but answer might be harder. I can’t work out the effect on this http://www.socketstudios.com/ site. It’s bascialy responsive and full screen presentation. There’s scrollTo plugin, which is unavilable anymore, so i’m looking for alternative, cause i’m not sure if it’s what causes the effect, and even if is, if you need any more plugins.

Answer 1

For the resizing of the images, they are using a script that listens for the resize event.

$(window).resize(function() {             
var top_target = '#work'+current_section;
var $main = $('#main');
$main.scrollTo(top_target);

var i=0;
    for (i=0;i<=15;i++)
    {
  var $container = $('#work'+i);
  var left_target = '#workcontent1';
  $container.scrollTo(left_target);
    }


var left_target = '#workcontent'+current_image;
var $work_container = $('#work'+current_section);
$work_container.scrollTo(left_target);

// Get Window Size

var myWidth = 0, myHeight = 0;

myWidth = $(window).width();
myHeight = $(window).height();

if(myHeight >= 900){
    image_height = 900;
    image_width = 1350;
}
else{
    image_height = myHeight;
    image_width = image_height * 1.5;
}

 // Set Image Offset

var $imgcont = $('.imgcontainer');

$imgcont.css('width', +image_width);
    $imgcont.css('margin-top', +image_height / -2 + "px");
$imgcont.css('margin-left', +image_width / -2 + "px");
 });