JQuery选择和交换样式表href值

JQuery to Select and Swap Stylesheet href values

本文关键字：href 样式 交换 选择 JQuery      更新时间：2023-09-26

我想知道如何在下面的resize函数中选择下面的两个样式表链接。我需要根据方向值修改两个链接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>

输入你的样式表和id，然后像这样修改:

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

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

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

只有当用户浏览器的方向是横向时，才会包含这个样式表。

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

另一个SO问题:CSS3:检测iPhone设备方向

最好把两个css放在一个文件中，以后不要更改css。Css首先被加载。只有这样你的javascript才会执行。首先，你的默认css将被加载。然后你会改变href标签(使用其他答案)，然后下一个文件将被加载。给服务器打了一个额外的电话。更好的主意是同时拥有(landscape &在一个文件中定义CSS。恕我直言，80%的css用于景观&;Potrait是一样的，剩下的20%可以使用第一个链接的朴素CSS来配置。

相关文章：