Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [CSS][JS][AJAX?] Dynamiczna zmiana zawartości CSS
Puszy
post
Post #1





Grupa: Zarejestrowani
Postów: 279
Pomógł: 42
Dołączył: 10.10.2011

Ostrzeżenie: (0%)
-----

Witam. Mam pewien problem z klasą CSS po stronie klienta. Znalazłem temat który obrazuje mój problem lecz nie zawiera właściwej (dla mnie) odpowiedzi:

http://forum.php.pl/index.php?showtopic=78737

Jest to stary temat 2007 r. więc mam nadzieję że coś się zmieniło. Na Googlach też nie znajduję nic konkretnego.

[HTML] pobierz, plaintext 
  1. <input type="text" sklep="info" />
[HTML] pobierz, plaintext


takich elementów mogę mieć 1, 2, 100, 100000,

CSS wygląda tak
[HTML] pobierz, plaintext 
  1. input[sklep="info"]{
  2. 	background-color: #FF9;
  3. }
[HTML] pobierz, plaintext


Czego szukam? Funkcji JS lub czegokolwiek co zmieni wartość #FF9. Nie chcę używać tablic wszystkich elementów które tego używają, nie chcę dodawać class, id, rel bo kod nie jest skończony, nie chcę getElementById("id_name").setAttribute. nie wchodzi też w grę zmiana src w <link>. Strona nie może być odświeżana.

Najnormalniej w świecie chcę zmienić (np. funkcją change_c("FF0000"); ) zawartość fragmentu CSS.

Myślałem o użyciu AJAX, ale napotykam dwa problemy:
1. Nie wiem czy wygląd dynamicznie się zmieni.
2. Z tego co mi wiadomo AJAX zwraca "coś" i to "coś" muszę gdzieś wstawić, a nie mogę tego wstawić w <div> bo wynik musi być w <head> w <style>.

Reasumując żadne inne popularne rozwiązanie nie wchodzi w grę, tylko zmiana wartości fragmentu (w pliku .php w <head> albo osobnym .css) CSS.

Z góry dziękuję za odpowiedzi.
Go to the top of the page
+Quote Post
everth
post
Post #2





Grupa: Zarejestrowani
Postów: 782
Pomógł: 153
Dołączył: 21.07.2010

Ostrzeżenie: (0%)
-----

Czyli chcesz dodać własny plik js lub css po stronie przeglądarki?


--------------------
Już mi się ani wiedzieć, ani tym bardziej myśleć nie chce.
[Think different]!
Go to the top of the page
+Quote Post
Puszy
post
Post #3





Grupa: Zarejestrowani
Postów: 279
Pomógł: 42
Dołączył: 10.10.2011

Ostrzeżenie: (0%)
-----

Cytat(everth @ 10.10.2011, 18:09:04 ) *
Czyli chcesz dodać własny plik js lub css po stronie przeglądarki?


Nie. Chcę zmienić wartość CSS, np klasy a w tym przypadku wszystkich <input> z atrybutem "sklep" o wartości "info", za pomocą funkcji lub czegokolwiek.
Stronka ma za zadanie konwersje tabeli danych do tabeli złożonej z inputów, z kolei tło inputów musi mieć opcję zmiany tła. Tabela podzielona jest na 8 "paczek" kolumn, po 3-5 kolumn w każdej "paczce". W nagłówku tabeli jest wysuwany div z paletą kolorów, po wybraniu koloru wszystkie inputy w tej "paczce" zmieniają kolor na wybrany. Wydaje się że najprostszym rozwiązaniem jest utworzenie klas z kolorami i zmiana klasy wszystkich inputów w "paczce", niestety ta opcja odpada. Dodam że użytkownikami będą tylko osoby pracujące w moim biurze, więc mam dostęp do ich komputerów, dzięki czemu myślę nad dodaniem pliku .css który będzie znajdował się na każdym komputerze i jego zawartość edytowana będzie AJAXem. Tylko teraz (jutro to sprawdzę) nie wiem jak nakazać przeglądarce, po zmianie i zapisaniu pliku .css przez odpowiedni skrypcik w PHP wywołany AJAXem, żeby sformatowała stronę zgodnie z nowym plikiem bez odświeżania strony.
Go to the top of the page
+Quote Post
lobopol
post
Post #4





Grupa: Zarejestrowani
Postów: 1 729
Pomógł: 346
Dołączył: 4.04.2009

Ostrzeżenie: (0%)
-----

Najprostsze rozwiązanie dodaj po kliknięciu w jakiś element klasę np. elementowi body (powiedzmy klasa a), a w css ustaw 
[CSS] pobierz, plaintext 
  1. .info{
  2. color:#fff;
  3. }
  4. .a .info{
  5. color:#000;
  6. }
[CSS] pobierz, plaintext


--------------------
pehap.pl - moje portfolio
Go to the top of the page
+Quote Post
Puszy
post
Post #5





Grupa: Zarejestrowani
Postów: 279
Pomógł: 42
Dołączył: 10.10.2011

Ostrzeżenie: (0%)
-----

@lobopol
O tym nie pomyślałem, bardzo dobre rozwiązanie. Dzięki.

Ale rozwiązałem ten problem w troszeczkę inny sposób.

Tworzę dodatkowy plik css ale z rozszerzeniem .php

[PHP] pobierz, plaintext 
  1. <?php
  2. header("Content-type: text/css");
  3.  
  4. print "input[sklep=\"". $_GET["s"] ."\"]{";
  5. print "background-color: #". $_GET["c"] .";}";
  6.  
  7. ?>
[PHP] pobierz, plaintext


W HTML dodaję

[HTML] pobierz, plaintext 
  1. <link id="st" rel="stylesheet" href="style.php">
[HTML] pobierz, plaintext


i skrypcik JS

[PHP] pobierz, plaintext 
  1. function chs(color, sklep){
  2. 	document.getElementById("st").setAttribute("href", "style.php?r=" + Math.random() + "&c=" + color + "&s=" + sklep + "");
  3. }
[PHP] pobierz, plaintext



Math.random pozwala mi na zażądanie przeglądarce pobrania innego pliku, który tka naprawdę jest tym samym, color ustawia GET. Powyższe rozwiązanie jest zastosowane tylko do jednej kolumny. Teraz jestem w trakcie pisania reszty kodu gdzie wstawiam inputy hidden z wartościami kolorów poszczególnych kolumn (paczek kolumn), dzięki czemu w pliku css dopisuję każdą paczkę kolumn a GETem przesyłam "tablicę kolorów" czyli:

style.php?r=random&info=kolor&amaozn=kolor&...

Najprawdopodobniej zamienię random na obecny czas lub coś innego.
Go to the top of the page
+Quote Post
« Następny starszy · Po stronie przeglądarki · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 19.08.2025 - 04:12
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn