Как динамически менять таблицы стилей с помощью jquery?

Привет У меня есть страница, для которой у меня есть четыре различных таблиц стилей, как этотКак динамически менять таблицы стилей с помощью jquery?

 <link rel="Stylesheet" href="fancydropdown.css" title="style-1" type="text/css" /> 
     <link rel="Alternate" href="fancydropdown_1.css" title="style-2" type="text/css" /> 
     <link rel="Alternate" href="fancydropdown_2.css" title="style-3" type="text/css" /> 
     <link rel="Alternate" href="fancydropdown_3.css" title="style-4" type="text/css" />

И это мой HTML

<div id="menu"> 
    <ul class="tabs"> 
<li><h4><a href="#">In the blog &raquo;</a></h4></li> 
<li class="hasmore"><a href="#"><span>Styles</span></a> 
    <ul class="dropdown"> 
     <li><a href="#" rel="style-1">style-1</a></li> 
     <li><a href="#" rel="style-2">style-2</a></li> 
     <li><a href="#" rel="style-3">style-3</a></li> 
     <li><a href="#" rel="style-4">style-4</a></li>    
     <li class="last"><a href="#">Menu item 6</a></li> 
    </ul> 
</li> 
<li class="hasmore"><a href="#"><span>Topics</span></a> 
    <ul class="dropdown"> 
     <li><a href="#">Topic 1</a></li> 
     <li><a href="#">Topic 2</a></li> 
     <li><a href="#">Topic 3</a></li> 
     <li class="last"><a href="#">Topic 4</a></li> 
    </ul> 
</li> 
<li><h4><a href="#">Elsewhere &raquo;</a></h4></li> 
<li><a href="#"><span>About</span></a></li> 
<li class="hasmore"><a href="#"><span>Networks</span></a> 
    <ul class="dropdown"> 
     <li><a href="#">Twitter</a></li> 
     <li><a href="#">posterous</a></li> 
     <li><a href="#">SpeakerSite</a></li> 
     <li><a href="#">LinkedIn</a></li> 
     <li class="last"><a href="#">See more&hellip;</a></li> 
    </ul> 
</li> 
<li><a href="#"><span>Bookmarks</span></a></li>

это мой выпадающий класс

 <ul class="dropdown"> 
     <li><a href="#" rel="style-1">style-1</a></li> 
     <li><a href="#" rel="style-2">style-2</a></li> 
     <li><a href="#" rel="style-3">style-3</a></li> 
     <li><a href="#" rel="style-4">style-4</a></li>    
     <li class="last"><a href="#">Menu item 6</a></li> 
    </ul>

, когда я нажимаю на стиль-1 и так что на таблицах стилей можно изменить ..... Как я могу это сделать с помощью jquery? Может кто-нибудь мне помочь?

И, пожалуйста, предоставьте мне библиотеку для использования?

источник

2012-03-22 SoftwareNerd

Простой поиск в google будет достаточно. – machineaddict

Я попробовал несколько примеров, но не удался. Листы стилей не chnaging - @ machineaddict – SoftwareNerd

вы проверили на наличие ошибок javascript? вы должны использовать firebug – machineaddict

Вы только что изменили HREF своей таблицы стилей.

... HEAD 
<link rel="Stylesheet" href="style1.css" > 

... BODY 
<ul class="dropdown"> 
    <li><a data-stylesheet="style1.css">style 1</a></li> 
    <li><a data-stylesheet="style2.css">style 2</a></li> 
    <li><a data-stylesheet="style3.css">style 3</a></li> 
</ul> 

... SCRIPT 
$('.dropdown a').click(function(ev){ 
    ev.preventDefault(); 
    $('link').attr('href',$(this).data('stylesheet')); 
});

источник

2012-03-22 06:45:54

его рабочий, но css не применяется к странице .... – SoftwareNerd

Мне нужно внести любые изменения в href .. – SoftwareNerd

просто сделайте одну таблицу стилей и измените href. то, как вы настроили таблицу стилей, странно. Я изменю свой ответ, чтобы показать вам лучший способ. –

Пожалуйста, попробуйте выполнить то, что работает нормально. См. Демо здесь http://jsfiddle.net/fLzck/

<ul class="dropdown"> 
      <li><a href="#" rel="style-1.css">style-1</a></li> 
      <li><a href="#" rel="style-2.css">style-2</a></li> 
      <li><a href="#" rel="style-3.css">style-3</a></li> 
      <li><a href="#" rel="style-4.css">style-4</a></li>    
      <li class="last"><a href="#">Menu item 6</a></li> 
     </ul> 

$(".dropdown a").click(function() { 
    var thisRel = $(this).attr('rel'); 
    //alert(thisRel); 
    $("link[rel='stylesheet']").attr('href', thisRel); 
})

источник

2012-03-22 06:51:08 Dips

Как динамически менять таблицы стилей с помощью jquery?

ответ

Смежные вопросы