我有这个jQuery代码
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>
$( document ).ready( function() {
var $body = $('body'); //Cache this for performance
var setBodyScale = function() {
var scaleFactor = 0.35,
scaleSource = $body.width(),
maxScale = 600,
minScale = 30;
var fontSize = scaleSource * scaleFactor; //Multiply the width of the body by the scaling factor:
if (fontSize > maxScale) fontSize = maxScale;
if (fontSize < minScale) fontSize = minScale; //Enforce the minimum and maximums
$('body').css('font-size', fontSize + '%');
}
$(window).resize(function(){
setBodyScale();
});
//Fire it when the page first loads:
setBodyScale();
});
</script>
但是我想激活这个jQuery代码只有@media only screen and (min-width : 1025px) and (max-width : 2048px)
之后没有,而不是之前。
在1024px之前和2048px之后,脚本不应该做任何事情。
答案 0 :(得分:0)
我认为不可能从javascript获取@media配置。
您可以获得文档的宽度并检查其值:
var docWidth = $(document).width();
if (docWidth > 1024 && docWidth < 2048) {
// execute your function
}
我不知道是否需要,但如果用户调整窗口大小,您可能还需要绑定到resize事件:
$(window).resize(function(event) {
//execute your function
});
d
答案 1 :(得分:0)
使用jquery resize事件:
$(window).resize(function() {
// Check here the width
width = $(document).width();
if (width > 1024 && width < 2048) {
// do your code
}
});
我认为你可以用这个
做你想做的事