Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Efekt ikon na pulpicie
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
Yacho
Witam !

Mam nastepujacego typu watpliwosci :

Ikona = label + ikona wlasciwa

potrzebuje zrobic cos takiego ze w momencie klikniecia na label lub okine wlasciwa cala "ikona"
zmienia kolor tak jak to jest na pulpicie
Wiem ze mozna zmienic opacity obiektu - ale jak wykonac efekt "Zaniebieszczenia" ikonki ? najlepiej bez uzycia dodatkowych warstw bo nie chce dostac schizy przy 50 ikonkach winksmiley.jpg

Druga sprawa :
Klikam na ikonke - wszystko ok - klikam na nastepna i teraz jest problem gdyz do funkcji kliknieto_na(ikona) podaje ikone bierzaca - lecz musze gdzies trzymac referencje do ostatnio kliknietego obiektu - zeby go zdezaktywowac - teraz pytanie gdzie trzymac taka zmienna zeby dostep do niej byl statyczny i globalny ?

trzecia sprawa - jak w JS wykryc klikniecie prawym przyciskiem ? smile.gif
jarrod
1. Wstrzymuj się z przezroczystością bo IE 7 w ogóle tego nie obsługuje! :/ Już się zdążyłem na tym przejechać...

Robisz diva, w środku dwa następne. W pierwszym obraz ikonki a poniżej w drugim - label. Kiedy klikasz na któroś z tych pól to zmieniasz im klasę przez element.className. Kiedy klikasz gdzie indziej skrypt sprawdza czy jest jakiaś aktywna ikonka. Jeśli tak to zmienia jej klasę (znaczy diva) na normalną.

2. Stwórz sobie zmienną globalną która będzie trzymała element aktualnie zaznaczony. Jeżeli inkludujesz plik *.js to umieść taką zmienną w dowolnum miejscu ale poza ciałem funkcji. Wówczas taka zmienna automatycznie staje się globalna.


3.
  1. document.onmousedown = jakas_funkcja;
  2. function jakas_funkcja(e)
  3. {
  4. if(ie && event.button == 2)
  5. {
  6. // blok instrukcji dla IE
  7. }
  8. else if(n && e.which == 3)
  9. {
  10. // inne
  11. }
  12. }
ano
Mam taki pomysł, jak można uzyskać przeźroczystość za pomocą 2 obrazków: obrazek główny (ikona - np. plik.jpg) + obrazek dot.gif z przeźroczystością.
1. Kod na stronie:
  1. [...]
  2. <div class="ikona">
  3. <a href="java script:transparent('on')" class="gif"> </a> </div>
  4. </div>
  5. [...]


Styl do .ikona :
  1. background-image: url('plik.jpg');
  2. width: 230px; /* szerokosc tego obrazka */
  3. height: 210px; /* wysokosc tego obrazka */
  4. display: block;


Styl do .gif :
  1. width: 230%; /* szerokosc ikony */
  2. height: 210; /* wysokosc ikony */
  3. display: block


Funkcja transparent:
Kod
function transparent(status) {
if (status=="on") {  - coś w stylu: .gif>background-image: url('dot.gif'); - }
else {  - coś w stylu: .gif>background-image: url(null); - }

//nie znam się na JS, więc ten kod jest taki poglądowy winksmiley.jpg

Plik dot.gif wyglądał by tak:
Kod
,.
.,

Gdzie:
, - przeźroczysty pixel
. - pixel o barwie granatowej

Myślę, że takie coś powinno się dobrze sprawować.
Uwaga: wszystkie kody pisane 'z palca', więc raczej nie będą działać, chodzi mi tylko o przedstawienie mojego pomysłu winksmiley.jpg - Nie wykorzystuje on obrazków png, więc w IE będzie się wszystko dobrze wyświetlało
jarrod
hmmm....
już chyba lepiej zrobić png z przezroczystością (interpretowane dopiero od IE7) i dać go na którejś warstwie.
ano
Cytat(jarrod @ 27.10.2006, 23:21:04 ) *
hmmm....
już chyba lepiej zrobić png z przezroczystością (interpretowane dopiero od IE7) i dać go na którejś warstwie.


No właśnie o to chodzi! PNG z przezroczystością jest interpretowany dopiero od IE7, a gif z przezroczystością działa poprawnie pod IE 4, 5, 6...
Zajec
Cytat(jarrod @ 27.10.2006, 19:46:02 ) *
1. Wstrzymuj się z przezroczystością bo IE 7 w ogóle tego nie obsługuje! :/ Już się zdążyłem na tym przejechać...
Chcesz powiedzieć, że w IE7 nie ma już filter + opacity?!
jarrod
Cytat(Zajec @ 28.10.2006, 17:46:50 ) *
Chcesz powiedzieć, że w IE7 nie ma już filter + opacity?!

Nie ma w ogóle. W zamian też niczego nie ma...
Można o tym poczytać na blogu IE7 na stronie MS.
Zajec
Cytat(jarrod @ 28.10.2006, 19:07:30 ) *
Nie ma w ogóle. W zamian też niczego nie ma...
Można o tym poczytać na blogu IE7 na stronie MS.

Coś Ci się mylło.

http://zajec.net/test/opacity - działa.
jarrod
Cytat(Zajec @ 28.10.2006, 21:44:44 ) *
Coś Ci się mylło.

http://zajec.net/test/opacity - działa.

nie wiem na jakiej przeglądarce ty to widzisz ale jak odpalam IE7 na tej stronie to widzę dwa tak samo czerwone kwadraty. No wiesz.. każdy widzi to co chce widzieć ale to już by była przesada tongue.gif
Załączyć zdjęcie tego co ja widzę??

zdjęcie tego co widzę

a to blog IE7 dotyczący css-ów
Zajec
Kurcze, może to wina tego, że nie mam wersji finalnej,

Rozumiem, że testowałeś to na wersji final?

Czy ktoś jeszcze z finalną może potwierdzić nie działanie filters?

P.S.
Czy moderator może wydzielić ten stąd wątek IE7, żeby nie zaśmiecać?
jarrod
ale co chcesz potwierdzać. Na dole wcześniejszego postu dałem ci link do strony msdn na blog IE na temat css ów. Po prostu zajżyj...
mariuszn3
jarrod.. ta notka mówiąc 'filtry' ma na myśli css'owe hacki typu '* html'.. a nie dosłownie właściwość 'filter' przeczytaj dokładnie.
Filtry (czyli te wszystkie sztuczki by emulować opacity, czy podawać przezroczystość png - choć w IE7 już wsparcie dla PNG jest ok) działają tak samo w IE7 jak i IE6 najlepiej samemu się przekonać
Zajec
Cytat(mariuszn3 @ 18.12.2006, 19:40:26 ) *
jarrod.. ta notka mówiąc 'filtry' ma na myśli css'owe hacki typu '* html'.. a nie dosłownie właściwość 'filter' przeczytaj dokładnie.
Filtry (czyli te wszystkie sztuczki by emulować opacity, czy podawać przezroczystość png - choć w IE7 już wsparcie dla PNG jest ok) działają tak samo w IE7 jak i IE6 najlepiej samemu się przekonać

Więc jednak :-) Dzięki za rozjaśnienie sprawy!
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.