2010-03-28 2 views
0

Я строю css-файл, используя PHP, который позволяет мне легко настраивать цвет многих элементов. Возможно ли для меня «перестроить» таблицу стилей и применить ее к странице в DOM с помощью JQuery?Переключение JQuery и CSS - это возможно?

например.

<?php 
if (isset($_POST['mycolor'])){ 
$myColor = $_POST['mycolor']; 
} else { 
$myColor = "blue"; 
} 
?> 

<style type='text/css'> 
    .style1{ 
    color:<?php $myColor;?>; 
    } 
</style> 

Теперь на моей странице у меня есть ссылка вы можете нажать кнопку под названием «Изменение цвета на красный» и при нажатии кнопки «красный» он делает $ .post на мой PHP скрипт, который перестраивает CSS, включая .style1 - и позволяет странице изменять таблицу стилей.

Я не тестировал это, но он бы даже работал? Если бы я опубликовал новую таблицу стилей после публикации в dom ..., это бы даже применимо к странице?

+0

Кажется, это сработает ... muwhahaha – Joe

+0

вам нужно изменить to в первую очередь - – ahmet2106

ответ

1

Вы можете сделать что-то вроде этого, если все вашей таблицы стилей PHP генерируются:

function newCSS(params){ 
    $("link[href*=myStyles.php]:last").after('<link href="myStyles.php?'+ params +'" type="text/css" rel="Stylesheet" />'); 
    $("link[href*=myStyles.php]:first").remove(); 
} 

Это заменяет ссылку в голове новым ... новые стили вступят в силу после ее загрузки.

+0

Проблема в том, что между переключением старый css больше не существует на странице. Можно ли каким-либо образом не показывать новый css до его загрузки? – Joe

+0

@Joe - Wrap '$ (" link [href * = myStyles.php]: first "). Remove();' like this: 'if ($ (" link [href * = myStyles.php] "). Length > 2) {$ ("link [href * = myStyles.php]: first"). Remove(); } 'Это оставляет одну переопределенную таблицу стилей вокруг, поэтому вы никогда не останетесь без нее. –

0

Вы можете использовать функцию css установить различные свойства CSS на элементах:

$('.style1').css('color', 'red'); 
+0

Очевидно, но я делаю это, потому что вы не можете выбирать и обновлять элементы, основываясь только на их текущем значении «цвет». Поэтому я перестрою весь css и снова применим его к странице. Это та же концепция, что и css-коммутатор, это позволит мне редактировать все цвета без необходимости предварительно заданных файлов css. – Joe

0

Я рекомендую вам создать свой динамический CSS как PHP-файл. Более подробная информация здесь: http://www.barelyfitz.com/projects/csscolor/

EDIT: Вот улучшенное решение, используя селектор, представленный Ник:

$("link[href*=myStyles.php]").attr('href','myStyles.php'); 
0

Я не знаю, слышали ли вы когда-либо о LESS. Это хороший инструмент, который позволяет вам иметь «переменные» в вашем CSS. Кажется, что вы действительно хотите.

Посмотрите на This blog post, который должен вам помочь.

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