BAZA WIEDZY
Grafika Webmaster
Aktualności Porady dla Webmastera
Porady CSS Porady HTML Porady MySQL Porady PHP Porady Smarty Pozycjonowanie
Kursy Dokumentacje Skrypty PHP Skrypty JAVA
Windows Hardware Software Download Książki Projekty domów Katalog firm, stron Reklama
KURSY
Bazy danych w PHP
Kurs AdvancedAJAX
Kurs ASP
Kurs ASP.NET
Kurs C++
Kurs CSS
Kurs HTML
Kurs HTML drugi
Kurs JavaScript
Kurs MySQL
Kurs PHP
Kurs RSS
Kurs XHTML
Obiekty DOM
MANUALE
CSS1 - W3C
DOM - w budowie
PHP 2005
PHP 2006
Wyrażenia regularne
SHOUTBOX
STAT
Online: 56 | UU: 1232
[HTML-CSS] Zmiana kursora, własny kursor
Porady HTML, Porady CSS | 21 maj 2008 | Wizyt: 27226

Aby zmienić standardowy wygląd kursora pojawiającego się np. podczas najeżdzania myszą na odnośnik lub zwykły tekst należy zastosować odpowiednie style. Można zapisać oddzielnie przy każdym ze znaczników lub jednorazowo dla wszystkich znaczników a lub p itd. Prócz kursorów udostępnianych przez style css, można również użyć własnych.

Przykład 1 - kursor dla pojedynczego znacznika:

Kod: html4strict

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
  <title>Tytuł strony</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
  </head>
    <body>
    <!– Kursor dla pojedynczego odnosnika –>
    <a style="cursor:crosshair" href="index.html">egrafik.pl</a>
    <!–  Kursor dla pojedynczego akapitu –>
    <p style="cursor:help">egrafik.pl</p>
    </body>
</html>

Przykład 2 - kursor dla wszystkich znaczników a lub p:

Kod: html4strict

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
  <title>Tytuł strony</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">

    <style type="text/css">
    <!– Kursor dla wszystkich odnosnikow –>
    a {
    cursor:crosshair;
    }

    <!– Kursor dla tekstu w ramach elementu P –>
    p {
    cursor:help;
    }
    </style>

  </head>
   <body>
   </body>
</html>

Przykład 3 - własny kursor:

Kod: html4strict

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
  <title>Tytuł strony</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
  </head>
   <body>
     <!– Wlasny kursor statyczny –>
     <a style="cursor:url("kursor.cur");" href="index.html">egrafik.pl</a>

     <!– Wlasny kursor animowany –>
     <a style="cursor:url("kursor.ani");" href="index.html">egrafik.pl</a>
   </body>
</html>

Poniżej lista dostępnych w css kursorów:

auto, croshair, default, e-resize, help, inherit, move, ne-resize, n-resize, nw-resize, pointer, se-resize, s-resize, se-resize, text, wait, w-resize. 

Opracowanie: Adam Suchowski

nowe Porady CSS » zobacz wszystkie

nowe Porady HTML » zobacz wszystkie

Dodaj komentarz









Komentarze
3 odpowiedzi
akanetiii
12 lipiec 2010, godz. 8:34

hmmm a jak to zrobic na windows xp black edition? (czy jakos tak) i jesli nie jest sie administratorem komputera?

gucio243
25 maj 2010, godz. 6:14

z tego co zauwazylem to ‘croshair’ nalezy pisac przez dwa “s” (crosshair), a

Bolod
21 kwiecień 2009, godz. 5:52

A jak zmienić kursor z powrotem na zwykły z ,,CursoMani” ??
 
Copyright © 2006-2013 egrafik.pl | Kontakt | Reklama | Projekty domów
jocker