首页 > TAG信息列表 > media-queries

JavaScript-Windows Phone 8:无法识别CSS方向

我正在尝试在CSS中所有移动设备上获取方向,并在方向更改上触发一些CSS. 这是对代码的简单测试: <div class="orientation"> <span class="landscape">Landscape</span> <span class="portrait">Portrait</span> </div>

如何使用媒体查询从HTML加载JavaScript文件

根据浏览器的大小,是否可以(如果可以,如何)使媒体查询从HTML加载不同的javascript文件? 与此类似的东西吗? <script media="screen and (max-width: 900px)" src="/js/menu_home.js" type="text/javascript"></script> 或类似我在互联网上找到的东西,但没有加载任何文件 <script>

javascript-根据屏幕尺寸/媒体查询更改Bootstrap列类属性

我正在使用Twitter的引导程序,但遇到了问题.我正在使用网格系统,并且在我的html中使用了col-lg-6类来创建宽度相等的两个不同的列.参见下面的代码: <div class="row"> <div class="row sameHeightCols"> <div class="col-lg-6"> <div class="contentBloc

使用javascript或jQuery生成CSS媒体查询

是否可以使用Javascript或jQuery动态创建完整的媒体查询规则? 我使用了大量的媒体查询来使用内联CSS,导入和链接文件来定位通用视口和特定设备/屏幕: @media screen and (min-width:400px) { ... } @import url(foo.css) (min-width:400px); <link rel="stylesheet" type="text/css"

HTML5:使用javascript检测您是使用手机还是PC?

参见英文答案 > What is the best way to detect a mobile device?                                    51个 我可以使用哪些JavaScript代码来检测用户是否在HTML5中的移动或PC / mac浏览器上?解决方法:几年前我正在研究这个问题.简而言之,您

android – 如何定位dppx大于2但小于3的设备

参见英文答案 > Using Sass Variables with CSS3 Media Queries                                    5个 我正在尝试为具有2dppx像素比的设备应用一些css规则,而对于具有3dppx或更高的设备则应用其他一些css规则. 因为我只针对小型设备(手机

javascript – 更好的替代@media查询?

我现在正在使用它, @media (max-width: 1024px) { #icons { border-radius: 0px } } @media ( width: 1025px) { #icons { border-radius: 1px 1px 0px 0px } } @media ( width: 1026px) { #icons { border-radius: 2px 2px 0px 0px } } @media ( width: 1027px) { #icon

javascript – 如何阻止respond.js阅读我的视网膜显示媒体查询?

我已经添加了respond.js来激活ie7中的媒体查询,我现在遇到的问题是ie7 8现在似乎正在阅读视网膜显示媒体查询,你可以想象它正在弄乱我的布局.有没有其他人遇到这个问题,如果是这样,怎么能防止这个? @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen a

为什么apple.com使用javascript动态加载视网膜图像而不是媒体查询?

Apple.com始终首先显示标准图像,然后使用javascript加载视网膜图像(如果设备支持视网膜). 我想知道苹果为什么不直接使用CSS媒体查询来减少HTTP请求?解决方法:简答 – 浏览器预取. 除了使用JS之外,他们无能为力: >进行媒体查询测试,使用JS,并在有支持的情况下填写HQ图像 >进行媒体查

如何使用javascript触发用户需求的媒体查询

我有一个响应式网页,针对不同的屏幕尺寸设计了不同的设计,我正在使用@mediaquery来改变我的设计.即使屏幕尺寸没有变化,我也希望用户能够更小或更大的屏幕尺寸更改设计. 是否可以使用js触发@mediaquery而不改变其大小?解决方法:看看Enquire.js,一个轻量级的纯JavaScript库,用于响应C

如果用户调整页面大小,请更改页面的JavaScript代码

1.总结 我在我的网站上为PC和移动设备使用CSS和JavaScript代码的媒体查询.如果PC用户调整我网站的页面大小,那么活动窗口的宽度将< 60rem,CSS用于页面更新,但JavaScript代码不更新→页面有错误.我没有找到,我应该怎么做,JavaScript将作为CSS媒体查询更新. 2.设置 >我的网站页

javascript – 使用媒体查询重组表

我有一个包含四列和两行的表,如下所示: <table> <tr> <td> A </td> <td> B </td> <td> C </td> <td> D </td> </tr> <tr> <td> E </td> <td> F </td> <td&g

android – CSS溢出会破坏Galaxy Tab上的点击事件

我觉得我错过了一些基本的东西. 上: 三星的Galaxy Tab 10.1(在其他Andoid设备上可能是真的 – 不确定) Dolphin或内置’默认’浏览器任何使用overflow:auto或overflow-y auto设置样式的块元素,以获得垂直滚动条会导致div在单击子项时甚至不在事件树中. 例如.我有这样的事情: <div id=

如果屏幕低于480像素,则阻止Javascript继续执行功能

首先,我不是一个JavaScript专家.我试图弄清楚如何对某个javascript进行条件执行,我会发疯的.我正在使用JQuery绝对将我的块放在浏览器页面中,但前提是屏幕大小大于480px(换句话说,我不希望这个脚本在智能手机上运行).我正在使用CSS媒体查询来表明我的请求.问题是,这个脚本适用于所

PhoneGap Android媒体查询

我一直在努力这一周.我已经阅读了大量的帖子/网站/提示和技巧,但我无法弄清楚这一点. 我需要为不同的屏幕尺寸和方向设置CSS规则.但认识到它不起作用. 我尝试过: min-width,max-width,min-height,max-height,min-device-width,max-device-width,min-device-height,max-device-height