![]() |
![]() ![]() |
![]() |
![]()
Post
#1
|
|
Grupa: Zarejestrowani Postów: 17 Pomógł: 0 Dołączył: 16.05.2013 Ostrzeżenie: (0%) ![]() ![]() |
Cześć wszystkim. Jestem kompletny zieloniak do takiego stopnia, że nawet nie wiedziałem jak nazwać ten temat. Dlatego proszę o wyrozumiałość. Nie wiem nawet czy to o co pytam tyczy się PHP czy jest to Java, w każdym razie jako tag zaznaczyłem to pierwsze. Mam ideę i szukam odpowiedzi na pytanie by tę ideę zrelizować.
Chcę utworzyć przycisk który będzie zamieszczony na stronie i po kliknięciu będzie odsyłał do innej strony, ale nie ma to być zwykły przycisk bo ma się zachowywać w następujący sposób. 1) Jest sobie przycisk, jakby nigdy nic. ![]() 2) Najeżdza użytkownik strzałką i obrazek się podświetla, zmienia kolor... ![]() 3) ...a po kliknięciu zmienił wygląd kompletnie, do tego stopnia że nie przypomina tego z podpunktu 1 i 2 o tak np. ![]() Tak ma to wyglądać w uproszczonym przykładzie, bo dodatkowo mam zamiar zmieniac nie tylko kolor ale grafikę zamieszczoną w buttonie, a może nawet jakieś obramowanie etc. sam nie wiem. Chcę by był jak najlepszy efekt. Jakieś sugestie, pomysły? Nie chodzi tutaj nawet o klepanie przez Was kodu etc. Grafikę jestem w stanie zrobić sobie samemu. Potrzebuję jedynie informacji i fachowych określeń co gdzie szukać, czym się zainteresować itd. Tak abym po przeanalizowaniu treści w miarę bezproblemowo przy odrobienie prób i błędów był w stanie w dośc szybkim czasie osiągnąć pożądany efekt. Dziękuję za przeczytanie wątku i czekam z niecierpliwością na odpowiedź. Ten post edytował Daiquiri 17.05.2013, 06:26:05
Powód edycji: [Daiquiri]: Poprawiam tag ;-)
|
|
|
![]()
Post
#2
|
|
![]() Grupa: Zarejestrowani Postów: 352 Pomógł: 59 Dołączył: 16.01.2013 Ostrzeżenie: (0%) ![]() ![]() |
Użyj w CSS :hover na podpunkt 2, a na podpunkt 3 np. jQuery i zdarzenie click
|
|
|
-Andrzej.W.- |
![]()
Post
#3
|
Goście ![]() |
css
Kod a:active
a:visited a:hover |
|
|
![]()
Post
#4
|
|
![]() Grupa: Zarejestrowani Postów: 352 Pomógł: 59 Dołączył: 16.01.2013 Ostrzeżenie: (0%) ![]() ![]() |
|
|
|
-Andrzej.W.- |
![]()
Post
#5
|
Goście ![]() |
|
|
|
![]()
Post
#6
|
|
Grupa: Zarejestrowani Postów: 17 Pomógł: 0 Dołączył: 16.05.2013 Ostrzeżenie: (0%) ![]() ![]() |
Dzięki wielkie.
To znaczy wiecie. Nie chciałem Was zarzucać problemami i na krzywego wchodzić i czekać aż ktoś da mi na tacy cały kod, ale nie obrażę się jeśli będziecie chcięli się podzielić szerszą wiedzą. Nie mam ambicji być koderem, ale muszę sobie stworzyć takie buttony i tyle ![]() Jutro przetestuję. Tym czasem ja lecę i pozdrawiam. |
|
|
-Andrzej.W.- |
![]()
Post
#7
|
Goście ![]() |
Ciężko jest w poście na forum tłumaczyć humaniście różniczkowanie. Poczytaj o tym, co Ci podaliśmy i wróć z konkretnymi pytaniami, to na pewno znajdą się odpowiedzi.
![]() Pozdrawiam. Andrzej. |
|
|
![]()
Post
#8
|
|
![]() Grupa: Zarejestrowani Postów: 1 335 Pomógł: 34 Dołączył: 9.11.2005 Skąd: Wrocław Ostrzeżenie: (10%) ![]() ![]() |
Czy chodziło o coś takiego: http://jsfiddle.net/teTBf/ ?
-------------------- > > > Tworzenie stron < < <
|
|
|
![]()
Post
#9
|
|
Grupa: Zarejestrowani Postów: 17 Pomógł: 0 Dołączył: 16.05.2013 Ostrzeżenie: (0%) ![]() ![]() |
OK Panowie. Zaznajomiłem się trochę z tematem i zamieszczone przez Was treści pomimo że są zdawkowe nakierowały mnie na pewne stronki i dziękuję Wam za to... ale to wciąż nie to. Przypuszczam że jeśli chcę osiągnąć taki efekt jaki chcę nie wystarczy się ograniczyć jedynie do samego kodu przedstawiającego Button z tekstem w środku, tylko będzie potrzebne wykorzystanie plików graficznych tak jak wcześniej napisałem. A tutoriale które odnalazłem w sieci "oferują" wiedzę ograniczoną jedynie do kodu bez wykorzystania grafiki zewnętrznej.
Jakby ktoś zrozumiał to co napisałem, miał wolną chwilę i wiedzę to niech wrzuci jakiś odnośnik do tutoriala który może mi pomóc. Tymczasem ja robię nadal research na własną rękę. Pozdro i do kolejnego "przeczytania" ![]() |
|
|
![]()
Post
#10
|
|
![]() Grupa: Zarejestrowani Postów: 1 335 Pomógł: 34 Dołączył: 9.11.2005 Skąd: Wrocław Ostrzeżenie: (10%) ![]() ![]() |
Coś takiego: http://jsfiddle.net/teTBf/1/ ? Bo ja już przestałem czaić, o co w ogóle Ci chodzi. Tutaj masz wykorzystane pliki graficzne. A jeżeli nie chodzi Ci o button, to masz na DIV'ach: http://jsfiddle.net/teTBf/2/ . Czy takie coś odpowiada?
-------------------- > > > Tworzenie stron < < <
|
|
|
![]()
Post
#11
|
|
Grupa: Zarejestrowani Postów: 55 Pomógł: 10 Dołączył: 12.08.2007 Ostrzeżenie: (0%) ![]() ![]() |
OK Panowie. Zaznajomiłem się trochę z tematem i zamieszczone przez Was treści pomimo że są zdawkowe nakierowały mnie na pewne stronki i dziękuję Wam za to... ale to wciąż nie to. Przypuszczam że jeśli chcę osiągnąć taki efekt jaki chcę nie wystarczy się ograniczyć jedynie do samego kodu przedstawiającego Button z tekstem w środku, tylko będzie potrzebne wykorzystanie plików graficznych tak jak wcześniej napisałem. A tutoriale które odnalazłem w sieci "oferują" wiedzę ograniczoną jedynie do kodu bez wykorzystania grafiki zewnętrznej. Jakby ktoś zrozumiał to co napisałem, miał wolną chwilę i wiedzę to niech wrzuci jakiś odnośnik do tutoriala który może mi pomóc. Tymczasem ja robię nadal research na własną rękę. Pozdro i do kolejnego "przeczytania" ![]() Wyjaśnij dokładnie o co Ci chodzi, to zrobię Ci przykład i wytłumaczę krok po kroku. :-) |
|
|
![]()
Post
#12
|
|
Grupa: Zarejestrowani Postów: 17 Pomógł: 0 Dołączył: 16.05.2013 Ostrzeżenie: (0%) ![]() ![]() |
Rzeczywiście zakręciłem, ale @in5ane poszedł dobrym tropem.
Chodzi o to że można zrobić button na kilka sposobów jedynie dzięki kodowi jak tu: http://www.cssbuttongenerator.com/ bez wykorzystania plików graficznych, a więc bez większych fajerwerków jedynie z tekstem w środku. A mi chodzi o to że na jeden przycisk mają być wykorzystane 3 pliki w .png 1) przed kliknięciem 2) z kursorem nad obrazkiem i 3) po kliknięciu. No i żeby efekt był taki żeby przenosiło pod inny adres. Czyli np. Pierwszy obrazek (normalny) przedstawia miniaturę zdjęcia jakiejś osoby (np. o nazwie obrazek.png), jak najedziesz na zdjęcie kursorem to zmienia się nieznacznie tło za tą twarzą (podswietlonyobrazek.png) i trzeci obrazek już po kliknięciu np. ze znaczkiem O.K albo uśmiechnięta buzią (obrazekpokliknieciu.png). O to chodzi. Dodatkowo chciałbym dodać do tego zliczanie oddanych głosów z jednego IP dziennie, ale to już do dalszego researchu. Jakbyś miał chęć możesz pomóc, tymczasem idę metodą prób i błędów porobić jakieś testy na podstawie tego co @in5ane napisał. aktualizacja: 24 maja To znowu ja. Zgodnie z moimi przewidywaniami na samym początku błędnie nazwałem temat bo nie chodziło stricte o button tylko o obrazek no i dodatkowo tagi musiały być skorygowane przez moderatora. Chodziło o wykorzystanie 3 obrazków: przed kliknięciem: ![]() podświetlony po najechaniu: ![]() po kliknięciu: ![]() Wyszło mi takie coś: http://jsfiddle.net/danten1/GM4Mu/ Jakieś sugestie? Bo napewno coś popieprzyłem. Następne na liście to ukrycie linka (w tym wypadku akurat do forum.php.pl) chyba potrzebny będzie jakiś skrypt? Jakieś sugestie? Tymczasem lecę pogłębiać wiedzę w tej materii samemu. Ten post edytował prantan 24.05.2013, 15:29:52 |
|
|
![]()
Post
#13
|
|
Grupa: Zarejestrowani Postów: 55 Pomógł: 10 Dołączył: 12.08.2007 Ostrzeżenie: (0%) ![]() ![]() |
Trochę zapomniałem o tym topicu.
Rozwiązanie: http://jsfiddle.net/jepek/JcjL8/ Kombinowałeś bardzo słusznie. Zabrakło Ci jednak trochę wiedzy. Jak widzisz wystarczy sam link. Poczytaj o elementach blokowych i liniowych i ich właściwościach w CSS - dzięki temu będziesz mógł ładnie stylować elementy liniowe jako blokowe i odwrotnie. Ten post edytował jepek 25.05.2013, 11:15:36 |
|
|
![]()
Post
#14
|
|
Grupa: Zarejestrowani Postów: 17 Pomógł: 0 Dołączył: 16.05.2013 Ostrzeżenie: (0%) ![]() ![]() |
Dziękuję, poczytam napewno.
Mam jeszcze taki problem. Jak napisałem wcześniej, chciałbym ukryć link spod tego obrazka oraz zliczać kliknięcia. Trafiłem na ten wątek: http://forum.php.pl/index.php?showtopic=61281, ale kompletnie nie czaję o co chodzi. Jak mógłbym to wszystko zaadaptować na zwykłej podstronie? Sprawa wydaje się wizualnie niby prosta, ale po drugiej stronie kryją się takie cuda że mała głowa. |
|
|
![]()
Post
#15
|
|
![]() Grupa: Zarejestrowani Postów: 654 Pomógł: 42 Dołączył: 27.07.2010 Skąd: Jaworzno Ostrzeżenie: (0%) ![]() ![]() |
Licznik ma być oparty na plikach czy na bazie danych mysql? ;-))
Napisz na czym się zatrzymujesz ![]() Ten post edytował xxdrago 26.05.2013, 11:15:12 -------------------- GG: 10972302 :)
|
|
|
![]()
Post
#16
|
|
Grupa: Zarejestrowani Postów: 17 Pomógł: 0 Dołączył: 16.05.2013 Ostrzeżenie: (0%) ![]() ![]() |
Wiecie może jak do tego http://jsfiddle.net/teTBf/2/ wrzucić odnośnik, żeby przerzucało do jakiejś strony? Najlepiej z target="_blank"
Korzystałem z tego http://jsfiddle.net/jepek/JcjL8/ ale jak widać tag jest pusty i przy wklejaniu tego kodu w edytorze, ckeditor wyrzuca kod. To znaczy zmiany na stronie zachodzą, ale przy edycji podstrony nie ma kodu. Mogę dać w tag jakiś napis ale wtedy wyświetla i tekst i obrazek, a to trochę bez sensu. Jakieś rozwiązania? |
|
|
![]()
Post
#17
|
|
Grupa: Zarejestrowani Postów: 1 729 Pomógł: 346 Dołączył: 4.04.2009 Ostrzeżenie: (0%) ![]() ![]() |
-------------------- |
|
|
![]() ![]() |
![]() |
Wersja Lo-Fi | Aktualny czas: 21.07.2025 - 12:23 |