 [jQuery] Przekazywanie zmiennych, większa/mniejsza czcionka |
  |
| [jQuery] Przekazywanie zmiennych, większa/mniejsza czcionka |
| -Wieviór- |
Post
#1
|
|
Goście  |
Mam taki oto kod, który pozwala na zmianę wielkości czcionki w divie #newsTresc1 klikając na linki #makeSmaller1 i #makeBigger1.
Działa, chociaż na pewno mógłbym go jakoś skrócić, zamiast dwóch funkcji stworzyć jedną (tu też proszę o jakieś wskazówki). Głównie jednak chodzi mi o to, że takich newsów na stronie mam powiedzmy 10 i dla każdego chciałbym mieć tą opcję. Linki i divy tworzą się z numerkami, bo są wyświetlane z pomocą pętli. Chciałbym, żeby numer z #makeSmaller(oraz analogicznie #makeBigger) był przekazywany do środka funkcji, żeby odpowiedni div obsługiwał. Kod $(document).ready( function() { $("#makeSmaller1").click( function() { var font = $("#newsTresc1").css("font-size"); var line = $("#newsTresc1").css("line-height"); var fontSize = parseFloat(font, 10); var lineHeight = parseFloat(line, 10); fontSize -= 2; lineHeight -= 3; $("#newsTresc1").css("font-size", fontSize + "px"); $("#newsTresc1").css("line-height", lineHeight + "px"); return false; } ); } ); $(document).ready( function() { $("#makeBigger1").click( function() { var font = $("#newsTresc1").css("font-size"); var line = $("#newsTresc1").css("line-height"); var fontSize = parseFloat(font, 10); var lineHeight = parseFloat(line, 10); fontSize += 2; lineHeight += 3; $("#newsTresc1").css("font-size", fontSize + "px"); $("#newsTresc1").css("line-height", lineHeight + "px"); return false; } ); } ); Dopiero zaczynam zabawę z jQuery, proszę o jakąś pomoc, z góry dzięki Ten post edytował Wieviór 21.12.2008, 20:28:13 |
 |
 
|
|
Post
#2
|
|
|
Grupa: Moderatorzy Postów: 15 467 Pomógł: 1451 Dołączył: 25.04.2005 Skąd: Szczebrzeszyn/Rzeszów |
Cytat Głównie jednak chodzi mi o to, że takich newsów na stronie mam powiedzmy 10 i dla każdego chciałbym mieć tą opcję. Linki i divy tworzą się z numerkami, bo są wyświetlane z pomocą pętli. Chciałbym, żeby numer z #makeSmaller(oraz analogicznie #makeBigger) był przekazywany do środka funkcji, żeby odpowiedni div obsługiwał. Zrób inaczej. Robisz nagłówki z trzema klasami, w ten deseń: Kod .fontOne #naglowek { font-size: large; } .fontTwo #naglowek { font-size: medium; } .fontThree #naglowek { font-size: small; } I obiekty, do których odnoszą się powyższe deklaracje zamykasz w kontenerze. Potem wystarczy JEDNA linijka: Kod $('#kontener').removeClass('fontOne fontTwo fontThree').addClass('fontOne'); i cała filozofia. (IMG:http://forum.php.pl/style_emoticons/default/winksmiley.jpg) |
|
|
|
| -Wieviór- |
Post
#3
|
|
Goście |
Ok, zdecydowanie Twoje rozwiązanie jest lepsze, zdecydowałem się na dwa rozmiary czcionki (normalny i większy). Teraz mój kod wygląda tak:
Kod $(document).ready( function() { $(".makeSmaller").click( function() { $("#newsTresc1").removeClass("newsTrescBigger").addClass("newsTresc"); } ); } ); $(document).ready( function() { $(".makeBigger").click( function() { $("#newsTresc1").removeClass("newsTresc").addClass("newsTrescBigger"); } ); } ); Nadal jednak nie wiem jak rozwiązać to, żeby dla danego przycisku zmieniał się rozmiar czcionki w danym newsie. Zmieniłem makeSmaller i makeBigger na class, nadaję im teraz id jako kolejne numery, chciałem żeby w środku tych funkcji, była instrukcja wyczytująca id, tego w co było kliknięcie i dodająca to do kawałku kodu: Kod $("#newsTresc[tutaj ta zmienna]") Jak wyczytać id klikniętego elementu? |
|
|
|
|
Post
#4
|
|
|
Grupa: Moderatorzy Postów: 15 467 Pomógł: 1451 Dołączył: 25.04.2005 Skąd: Szczebrzeszyn/Rzeszów |
Ale nie tak zrobiłeś.
Kod function() { $(".makeBigger").click( Nie dawaj tego dla klasy, a dla przycisku. Cytat Nadal jednak nie wiem jak rozwiązać to, żeby dla danego przycisku zmieniał się rozmiar czcionki w danym newsie. Przeczytałeś uważnie, co napisałem? (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif) Nie kombinuj z numerami nagłówków, bo nie ma takiej potrzeby. Wystarczy tylko elementowi nadrzędnemu nadawać klasy + deklaracje w CSS, jak napisałem. |
|
|
|
|
|
Aktualny czas: 16.09.2025 - 15:08 |
