我是JS的初学者。我有一个图像旋转木马什么工作得很好。但是,当我试图让它响应时,它不再滚动,响应的东西也不起作用。
Heres JS代码:
$(document).ready(function() {
var viewport = $( window ).width();
if ( viewport > 1024 ) {
$(".imagecarouselwrap").css("width","904");
$(".carouselinner").css("width","834");
}
else if ( 769 <= viewport >= 1023 ) {
$(".imagecarouselwrap").css("width","765");
$(".carouselinner").css("width","695");
}
else if ( 481 <= viewport >= 768 ) {
$(".imagecarouselwrap").css("width","348");
$(".carouselinner").css("width","278");
}
else ( 320 <= viewport >= 480 ) {
$(".imagecarouselwrap").css("width","209");
$(".carouselinner").css("width","139");
}
$("#inner_ul li:first").before($("#inner_ul li:last"));
$("#rightarrow img").click(function(){
var elemlaius = $("#inner_ul li").outerWidth();
var vasaktaane = parseInt($("#inner_ul").css("left")) - elemlaius;
$("#inner_ul:not(:animated)").animate({"left" : vasaktaane},500,function(){
$("#inner_ul li:last").after($("#inner_ul li:first"));
$("#inner_ul").css({"left" : "-139px"});
});
});
$("#leftarrow img").click(function(){
var elemlaius = $("#inner_ul li").outerWidth();
var vasaktaane = parseInt($("#inner_ul").css("left")) + elemlaius;
$("#inner_ul:not(:animated)").animate({"left" : vasaktaane},500,function(){
$("#inner_ul li:first").before($("#inner_ul li:last"));
$("#inner_ul").css({"left" : "-139px"});
});
});
});
请帮帮我。
我的补充部分:
var viewport = $( window ).width();
if ( viewport > 1024 ) {
$(".imagecarouselwrap").css("width","904");
$(".carouselinner").css("width","834");
}
else if ( 769 <= viewport >= 1023 ) {
$(".imagecarouselwrap").css("width","765");
$(".carouselinner").css("width","695");
}
else if ( 481 <= viewport >= 768 ) {
$(".imagecarouselwrap").css("width","348");
$(".carouselinner").css("width","278");
}
else ( 320 <= viewport >= 480 ) {
$(".imagecarouselwrap").css("width","209");
$(".carouselinner").css("width","139");
}
它将改变元素宽度设置,但如果我用较小的窗口观看它,它就不会完成他的工作。我使用http://quirktools.com/screenfly来观看较小的窗口
答案 0 :(得分:0)
这部分应该是其他的,如果,不是
else ( 320 <= viewport >= 480 ) {
$(".imagecarouselwrap").css("width","209");
$(".carouselinner").css("width","139");
}
else if ( 320 <= viewport >= 480 ) {
$(".imagecarouselwrap").css("width","209");
$(".carouselinner").css("width","139");
}