Aby tworzyć swoje własne kursory nie trzeba mieć żadnego specjalnego programu. Wystarczy Gimp lub jakiś inny program graficzny obsługujący warstwy.
Sam proces robienia kursora może być różny w zależności od tego co robimy. Możemy samodzielnie coś namalować, stworzyć lub wybrać jakiś obrazek i go "obrobić" (usunąć tło, zmniejszyć, ewentualnie coś jeszcze zmienić). W dzisiejszym poście pokażę tylko ten pierwszy sposób (samodzielnie zrobiony awatar), ponieważ niedługo stworzę instrukcję robienia wycinanego awataru, która pokaże jak wycinać tło z obrazka.
1. Aby kursor działał poprawnie powinien mieć wymiary: 16x16, 32x32 lub 64x64, dlatego po uruchomieniu programu graficznego tworzymy nowy obraz o jednych z podanych rozmiarów (Plik->Nowy).
2. Tworzymy nową warstwę bez tła oraz usuwamy starą z tłem (w Gimpie nazywa się Tło).
3. Uruchamiamy proces twórczy i rysujemy co chcemy. Bardzo pomocne mogą być brushe.
4. Gdy już skończymy nasz kursor, dorysowujemy na rogu obrazka strzałkę w taki sposób:
5. Jeśli uznamy, że kursor jest już gotowy to najwyższa pora zapisać go. Aby nie utracić przeźroczystego tła musi mieć rozszerzenie .png .
6. Kolejnym krokiem jest zahostingowanie go. W tym celu należy wejść na stroną służącą do hostingu zdjęć i wgrać na nią nasz kursor. Osobiście polecam: tinypic, imageshack (niestety potrzebna jest rejestracja), fotosik.
7. Posiadając link do obrazka możemy wstawić go do kodu. Aby ułatwić zadanie zostawiłam w kodzie tylko miejsce na link:
Tak powinno to wyglądać:
I to wszystko. Na koniec zostawiam Wam mój kursor robiony na potrzebę tego postu :)
mugi-chan
Sam proces robienia kursora może być różny w zależności od tego co robimy. Możemy samodzielnie coś namalować, stworzyć lub wybrać jakiś obrazek i go "obrobić" (usunąć tło, zmniejszyć, ewentualnie coś jeszcze zmienić). W dzisiejszym poście pokażę tylko ten pierwszy sposób (samodzielnie zrobiony awatar), ponieważ niedługo stworzę instrukcję robienia wycinanego awataru, która pokaże jak wycinać tło z obrazka.
1. Aby kursor działał poprawnie powinien mieć wymiary: 16x16, 32x32 lub 64x64, dlatego po uruchomieniu programu graficznego tworzymy nowy obraz o jednych z podanych rozmiarów (Plik->Nowy).
2. Tworzymy nową warstwę bez tła oraz usuwamy starą z tłem (w Gimpie nazywa się Tło).
3. Uruchamiamy proces twórczy i rysujemy co chcemy. Bardzo pomocne mogą być brushe.
4. Gdy już skończymy nasz kursor, dorysowujemy na rogu obrazka strzałkę w taki sposób:
5. Jeśli uznamy, że kursor jest już gotowy to najwyższa pora zapisać go. Aby nie utracić przeźroczystego tła musi mieć rozszerzenie .png .
6. Kolejnym krokiem jest zahostingowanie go. W tym celu należy wejść na stroną służącą do hostingu zdjęć i wgrać na nią nasz kursor. Osobiście polecam: tinypic, imageshack (niestety potrzebna jest rejestracja), fotosik.
7. Posiadając link do obrazka możemy wstawić go do kodu. Aby ułatwić zadanie zostawiłam w kodzie tylko miejsce na link:
Oczywiście link do obrazka wklejamy w nawiasie w miejscu LINK. Uzupełniony kod należy wkleić na początku prezentacji w trybie HTML. Na samym końcu prezentacji musi się znaleźć znacznik zamykający </div>.<div style="cursor: url(LINK), wait">
Tak powinno to wyglądać:
I to wszystko. Na koniec zostawiam Wam mój kursor robiony na potrzebę tego postu :)
Kod na początek prezentacji | Kod na koniec prezentacji | |
<div style="cursor: url(http://oi58.tinypic.com/13zyfk8.jpg), wait"> | </div> |
mugi-chan
Super poradnik i ładny kursor.:)
OdpowiedzUsuńDziękuję bardzo za radę :D Na 100% użyję :DD Zapraszam na konto kon87
OdpowiedzUsuńCały czas korzystam z postu. (:
OdpowiedzUsuńŚwietny.