无法得到这个JavaScript与我的CSS沟通 [英] can not get this javascript to communicate with my css
问题描述
快速提问。我真的很喜欢这种风格，因为当有人用半屏宽度浏览（最终在移动设备上）时，可以捕捉到更小的风格类。现在我正试图在屏幕小于~700像素时添加小类。如果有人能指出我的codepen没有调整那个太棒的课程。多谢你们。
quick question. I really would like the style for when someone is browsing in half screen width(and eventually on mobile) to snap to a smaller style class. Right now i am trying to add the class "small" when the screen is smaller than ~700 px. If someone could point out when my codepen isn't adjusting the class that would be fantastic. Thanks guys.
...也是的我的codpen用户名是garvdaddy，别欺负我：P
...also yes my codpen username is garvdaddy, dont bully me :P
html我定位：< p id =content>
http://codepen.io/garvdaddy/full/EKZMXp/
http://codepen.io/garvdaddy/full/EKZMXp/
推荐答案
您可以使用小型JavaScript函数自动调整宽度：
You can adjust the width automatically using a small javascript function:
-
添加 id 属性添加到
< link>元素：
< link rel =stylesheettype =text / csshref =widescreen.cssid =link1/>
我们需要我们称之为函数的事件，因此将属性 onload 和 onresize 添加到< body>
We need events on which we call functions, so add attributes onload and onresize to <body>
< body onresize =f（）onload =f（）>
...
< / body>
最后添加将处理页面上的更改
Finally add the javascript function that will handle the changes on the page
< script>
函数f（）{
if（document.body.clientWidth< 700）
//检查页面宽度是否小于700的条件
{document.getElementById（ link1）。setAttribute（href，mobileresolution.css）;}
//如果是，则借助函数.getElementById获取id =link1的元素并更改其属性的href值为mobileresolution.css
else
{document.getElementById（link1）。setAttribute（href，widthcreen.css）;}
//如果宽度页面不小于700，那么href的值是widescreen.css
}
< script>
这篇关于无法得到这个JavaScript与我的CSS沟通的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
