Question

简单的问题，但答案可能更难。我无法解决这个http://www.socketstudios.com/网站的影响。它是bascialy响应和全屏显示。有scrollTo插件，这是不可用的，所以我正在寻找替代，因为我不确定它是什么导致效果，即使是，如果你需要更多的插件。

Answer 1

为了调整图像大小，他们使用的是监听resize事件的脚本。

$(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");
 });

Answer 2

你可以成为一个忍者并使用循环插件，然后使用向上，向下，向左滚动，将页面大小和按钮固定在固定位置。这需要一个jQuery库。

http://jquery.malsup.com/cycle/int2.html

很酷的想法！：D所以正常向上和向下滚动，每个上下都有上一个和下一个，但正如我所说，你肯定必须是一个忍者。

jQuery全屏幻灯片显示4个方向

2 个答案: