Responsive JavaScript - 加载/隐藏与浏览器宽度相关的特定功能？

首先：我没有进入JavaScript/JQuery！ ......但我会尽力指出我想要做的事情。Responsive JavaScript - 加载/隐藏与浏览器宽度相关的特定功能？

我使用我的网页上的梦幻般的bx滑块，我通过媒体查询使我的网站响应，这两个工作都很好迄今。 ...但是有一些来自bx-slider-script的特性，我不想在特定的浏览器宽度上激活它。这里就是我想要的：

浏览器的宽度大于500像素=负荷的情况下这个功能：

$('#slider4').bxSlider({ 
    minSlides: 2, 
    maxSlides: 2, 
    slideWidth: 230, 
    slideMargin: 10, 
    nextSelector: '#next', 
    prevSelector: '#prev', 
    infiniteLoop: false, 
    hideControlOnEnd: true, 
    pager: false, 
    useCSS: false, 
    easing: 'easeInOutExpo', 
    speed: 1000 
});

浏览器的宽度大于500像素=隐藏以上功能并加载这一个：

$('#slider4').bxSlider({ 
    minSlides: 4, 
    maxSlides: 4, 
    slideWidth: 230, 
    slideMargin: 20, 
    nextSelector: '#next', 
    prevSelector: '#prev', 
    infiniteLoop: false, 
    hideControlOnEnd: true, 
    pager: false, 
    useCSS: false, 
    easing: 'easeInOutExpo', 
    speed: 1000 
});

...甚至可以在JavaScript中使用？我尝试了一些使用突破点的脚本，但它认为我的JS知识很弱，无法按照我的需要进行工作。

这将是伟大的，如果有人在这里可以告诉我如何轻松做到这一点！

来源

2013-10-17 Jochen Schmidt

@Spontifixus：..why你删除 “谢谢”？ –

在Stack Overflow上有一个社区的consesus来删除帖子中的致谢和签名。有关更多详细信息，请参阅[本文讨论]（http://meta.stackexchange.com/a/3021/195761） – Spontifixus

If($(document).width() < 500){ 
... 
}else{ 
... 
}

http://api.jquery.com/width/

您可能还需要放在一个onchange事件

$(window).resize(function() { 
resizefunction(); 
});

http://api.jquery.com/resize/

来源

2013-10-17 09:04:06

感谢您的回答，但这不起作用..我尝试用函数替换“...”以上，但现在脚本不再加载！？！ –

@JochenSchmidt它工作，看看这个小提琴：http://jsfiddle.net/jDkDJ/2/ –

我很抱歉的人..我想我错过了东西在第一个地方..它现在是wokrs！谢谢！和btw：有没有办法重新加载页面时自动重新给定的宽度？ –

Responsive JavaScript - 加载/隐藏与浏览器宽度相关的特定功能？

回答

相关问题