Question

我想知道如何在下面的调整大小功能中选择下面的两个样式表链接。我需要根据方向值修改两个链接href值，但我不确定如何选择并填充下面条件语句中的那些，任何想法？

 <head>
                <link rel="stylesheet" href="css/style.css" type='text/css' media='all' />
                <link rel="stylesheet" href="css/iphone.css" type='text/css' media='all' />
                <script type="text/javascript">
                       $ = jQuery
                       $(document).ready(function() {
                             $(window).resize(function() {
                                     var orientation = window.orientation;

                              if(orientation == 90 || orientation == -90) { 
                                    //populate href of stylesheet link here
                                   } else {
                                       //populate href of stylesheet link here
                                   }
                             });
                          });
                </script>
   </head>

Answer 1

只需提供你的样式表和id，然后改变它：

$("#id").attr("href", "/somecss.css");

Answer 2

如果使用CSS3，您可以使用css3媒体查询根据用户浏览器的方向更改样式。

<link rel="stylesheet" media="all and (orientation:landscape)"href="landscape.css">

如果用户浏览器的方向是横向，则仅包含此样式表。

请记住，这只适用于兼容CSS3的浏览器。

Answer 3

看看这个链接： http://www.1stwebdesigner.com/tutorials/how-to-use-css3-orientation-media-queries/

另一个问题： CSS3: Detecting device orientation for iPhone

最好将css放在一个文件中，而不是稍后更改css。 Css首先加载。只有这样你的javascript才会被执行。所以首先你的默认css将被加载。然后你会改变href标签（使用其他答案）然后将加载下一个文件。对服务器进行额外调用。更好的想法是在一个文件中定义（landscape＆amp; potrait）css。恕我直言80％的景观和广播的CSS potrait将是相同的，剩下的20％可以使用naive css fomr配置第一个链接。

JQuery选择和交换样式表href值

3 个答案: