Niestandardowe kursory na prezentacji

W poprzednim poście pokazywałam jak zmienić kursor na prezentacji ale do dyspozycji były tylko kursory, standardowe dla wszystkich komputerów. Jak się okazuje wcale nie tak trudno wstawić niestandardowy kursor. Jest tylko jedno ale - trzeba go mieć. Dlatego zanim pokaże jak się go wstawia, powiem coś na temat zrobienia go.

Do stworzenia własnego kursora potrzebujemy program graficzny. Należy pamiętać, że w zależności od programu uzyskamy różne efekty. Jeśli będzie istniała potrzeba to zrobię osobny post z instrukcją tworzenia własnych kursorów, ale uwierzcie mi to wcale nie jest takie trudne. Kursor powinien mieć wymiary 32 na 32 px lub 64 na 64 px.

Przejdźmy do kodu.
Tak jak w przypadku zmiany kursora posłużymy się kodem <div style="cursor: ♥">. Jednak on służy tylko do zmiany kursora, a my chcemy wstawić własny. W tym celu dostawiamy fragment url(♦), przed serduszkiem. Należy pamiętać o przecinku ponieważ kod bez niego nie będzie działać poprawnie. Gotowy kod powinien wyglądać tak:

<div style="cursor: url(♦), ♥">

Oczywiście powyższy kod wstawiamy na samym początku prezentacji, w trybie HTML. Aby kod zadziałał na samym końcu powinien znaleźć się znacznik zamykający div:

</div>

Gdy mamy budowę kodu, spokojnie mogę wyjaśnić co należy wstawić zamiast ♦ oraz ♥. 
Najpierw ♥. Jak zapewne pamiętacie w poprzednim poście podawałam tabelę w której znajdowały się odpowiednie formy do wstawienia zamiast ♥. Poniżej jeszcze raz pokażę tą tabelę:

Nazwa	♥
Strzałka	default
Rączka	pointer
Pomoc	help
Niewykonalne	not-allowed
Celownik	crosshair
Ładowanie	wait
Brak	none

Nie ma większego znaczenia to jaki kursor wstawimy w miejscu ♥. Jako, że na początku (zaraz po dwukropku) stoi fragment url, ważniejsze jest to co będzie w nawiasie, czyli ♦. Jak niektórzy wiedzą url odpowiada za wstawienie linku, czyli w nawiasie zamiast ♦ musimy wstawić link. A dokładniej link do obrazka z kursorem. 

I to by było na tyle. Poniżej mam kilka przygotowanych przeze mnie kursorów. Wstawiam je w formie tabeli od razu z kodem do wstawienia na początku prezentacji i na końcu. Za jakiś czas możecie się spodziewać porcji nowych kursorów. Na razie zostawiam Was z tymi:

	Kod na początek prezentacji	Kod na koniec prezentacji
	<div style="cursor: url(http://oi57.tinypic.com/16lfb6a.jpg), wait">	</div>
	<div style="cursor: url(http://oi57.tinypic.com/s1uhro.jpg), wait">	</div>
	<div style="cursor: url(http://oi57.tinypic.com/250pni0.jpg), wait">	</div>
	<div style="cursor: url(http://oi60.tinypic.com/sll8gh.jpg), wait">	</div>
	<div style="cursor: url(http://oi59.tinypic.com/b9gf2o.jpg), wait">	</div>
	<div style="cursor: url(http://oi57.tinypic.com/s6rwyf.jpg), wait">	</div>
	<div style="cursor: url(http://oi57.tinypic.com/2nav2xh.jpg), wait">	</div>
	<div style="cursor: url(http://oi57.tinypic.com/2yweq8i.jpg), wait">	</div>
	<div style="cursor: url(http://oi60.tinypic.com/20hajwg.jpg), wait">	</div>
	<div style="cursor: url(http://oi61.tinypic.com/eiv7rq.jpg), wait">	</div>
	<div style="cursor: url(http://oi57.tinypic.com/n4865l.jpg), wait">	</div>
	<div style="cursor: url(http://oi57.tinypic.com/2cdixa8.jpg), wait">	</div>
	<div style="cursor: url(http://oi59.tinypic.com/21b3z7p.jpg), wait">	</div>
	<div style="cursor: url(http://oi58.tinypic.com/2dl2ewy.jpg), wait">	</div>
	<div style="cursor: url(http://oi62.tinypic.com/3128kuf.jpg), wait">	</div>
	<div style="cursor: url(http://oi59.tinypic.com/2h80ejb.jpg), wait">	</div>
	<div style="cursor: url(http://oi58.tinypic.com/25723bd.jpg), wait">	</div>
	<div style="cursor: url(http://oi62.tinypic.com/2yljpye.jpg), wait">	</div>
	<div style="cursor: url(http://oi60.tinypic.com/2zemgd1.jpg), wait">	</div>
	<div style="cursor: url(http://oi57.tinypic.com/2s1njpt.jpg), wait">	</div>
	<div style="cursor: url(http://oi59.tinypic.com/2rdf8dg.jpg), wait">	</div>

Mam nadzieję, że wszystko jest zrozumiałe :)

mugi-chan

EDIT:

Poniżej znajduje się przykład jak powinien wyglądać poprawnie wklejony kod. W miejscu KOD KURSORA należy wkleić kod podany w ramce powyżej (mowa o kodzie na początek prezentacji).