javascript - 确定使用 jQuery 加载哪个 css

标签 javascript jquery html css

我有一个 html 页面,根据屏幕宽度加载不同的 css(针对 PC、平板电脑和手机):

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="all" href="css/style.css" >
<link rel="stylesheet" type="text/css" media="screen and (min-width: 1200px)" href="css/desktop-style.css" > 
<link rel="stylesheet" type="text/css" media="screen and (min-width: 769px) and (max-width: 1199px)" href="css/tablet-style.css" >
<link rel="stylesheet" type="text/css" media="screen and (min-width: 100px) and (max-width: 768px)" href="css/phone-style.css" >

我严重依赖 jQuery,并且应该根据事件的 css 选择函数。 jQuery 的 JavaScript 中有没有办法确定哪个 css 处于事件状态? 或者我应该使用 jQuery 来确定浏览器宽度,并根据宽度输出制定进一步的功能? 谢谢。

最佳答案

您可以检查是否 this线程有帮助。

您还可以考虑在 css 文件中使用媒体查询,并为不同的屏幕变体加载相同的文件。

关于javascript - 确定使用 jQuery 加载哪个 css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47633608/

相关文章:

javascript - jQuery:动画滚动到下一个只工作一次

javascript - 使用 python 2.7、beautiful soup 和 selenium 抓取 asp 和 javascript 生成表

javascript - 在滚动条上更改 div 的背景颜色

Node.js 中未解析的 JSON 数据在控制台中显示未定义

javascript - jQuery 结构和理解

javascript - 远程 css 背景图像未加载

javascript - 使 JS 宽度为 : toggle has beautiful animation

javascript - 如何在点击链接时弹出提醒

html - CSS 布局 : Is it possible to move the div box?

html - 数据列表奇怪的行为