关闭

js 根据屏幕大小调用不同的css文件

标签: aaaaa迷你
298人阅读 评论(0) 收藏 举报
分类:
原因:屏幕大小不一样,网站看起来总觉得怪怪的,所以,针对不同大小的屏幕,写了不同的css,写完了,要解决的问题就是:怎么根据屏幕的大小来引用不同的CSS,下面就是解决方法了.

解决方法:首先,在head标签里面先引用一个通用的CSS文件,如下:
    <link href="Styles/Style.css" id="css" rel="stylesheet" type="text/css" />
这时候,你会发现,这个和平常引用的CSS文件有些许不同,那就是,多加了一个ID,这里面就增加了一个id为css的id.

接下来,再弄一个js,代码如下:
 $(function () {
            //判断是否宽屏
            var winWide = window.screen.width;
            alert(winWide);
            var wideScreen = false;
            if (winWide <= 1024) {//1024及以下分辨率
                $("#css").attr("href""Styles/Style1.css");
                alert('小屏');
            } else {
                $("#css").attr("href""Styles/Style.css");
                alert('大屏');
                wideScreen = true//是宽屏
            }
})
好了,代码就是如此简单,各位看官,自己看着办吧...

不是伸手党的话,就点个推荐,或者收藏一下,有空闲的,给个小评论咯...
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:1535次
    • 积分:30
    • 等级:
    • 排名:千里之外
    • 原创:1篇
    • 转载:4篇
    • 译文:0篇
    • 评论:0条
    文章分类
  • a(1)
    文章存档