小编use*_*582的帖子

根据屏幕大小用jQuery替换样式表

嗨,我想知道是否有人可以提供帮助,我正在尝试使用jQuery创建一个响应式网站(必须这样做,因为目标受众是在IE7/8和css3-mediaqueries.js似乎干扰我的jQuery UI我也用).我使用以下脚本来检测宽度和高度并相应地应用样式,它适用于宽度而不是高度,它加载SMstyle.css然后用style.css覆盖.我正在尝试学习JavaScript,但目前还没有超强,我知道有一个更简单的方法!任何帮助,将不胜感激...

function adjustStyle(width) {
        width = parseInt(width);
        if ((width >= 701) && (width < 1200
        )) {
            $("#size-stylesheet").attr("href", "css/SMstyle.css");
        } else {
            $("#size-stylesheet").attr("href", "css/style.css");
        }
    }

    $(function() {
        adjustStyle($(this).width());
        $(window).resize(function() {
            adjustStyle($(this).width());
        });
    });

    function adjustStyle(height) {
        height = parseInt(height);
        if (height < 800
        ) {
            $("#size-stylesheet").attr("href", "css/SMstyle.css");
        } else {
            $("#size-stylesheet").attr("href", "css/style.css");
        }
    }

    $(function() {
        adjustStyle($(this).height());
        $(window).resize(function() {
            adjustStyle($(this).height());
        });

    });
Run Code Online (Sandbox Code Playgroud)

javascript jquery screen-size

5
推荐指数
1
解决办法
782
查看次数

如何将多个jQuery函数压缩成一个简洁的函数?

希望有人可以帮忙!我是一个jQuery/JS新手.有没有一种简单的方法可以将多个功能压缩成一个.我正在使用jQuery来扩展和折叠一些隐藏的div.我已经使用下面的代码工作得很好了,但是可能有50多个(不仅仅是4个)并且我假设有一种方法可以将它们压缩成优化名称中的一小部分代码.非常感谢任何帮助.这是JS ......

$('#toggle1').click(function() {
    $('.toggle').slideToggle('fast');
    return false;
    });

    $('#toggle2').click(function() {
    $('.toggle2').slideToggle('fast');
    return false;
    });
    $('#toggle3').click(function() {
    $('.toggle3').slideToggle('fast');
    return false;
    });

    $('#toggle4').click(function() {
    $('.toggle4').slideToggle('fast');
    return false;
    });
Run Code Online (Sandbox Code Playgroud)

这是HTML ...

 <div class="docBlocA">
  <div class="docTitle" id="toggle1">Document Title Goes Here (click to expand)</div>
  <div class="toggle1" style="display:none; width:100%;">Hidden div content here</div>
 </div><!--docBlocA-->

 <div class="docBlocB">
  <div class="docTitle" id="toggle2">Document Title Goes Here (click to expand)</div>
  <div class="toggle2" style="display:none; width:100%;">Hidden div content here</div>
 </div><!--docBlocB-->

 <div class="docBlocA">
  <div class="docTitle" id="toggle3">Document Title Goes Here (click to expand)</div>
  <div class="toggle3" style="display:none; …
Run Code Online (Sandbox Code Playgroud)

jquery toggle

2
推荐指数
1
解决办法
103
查看次数

标签 统计

jquery ×2

javascript ×1

screen-size ×1

toggle ×1