2012-01-10 15 views
157

ho questo a e non so che ho bisogno di inserire nel "onmouseover" in modo che il cursore si trasformerà in puntatore dito come un collegamento regolare:cambiamento cursore puntatore dito

<a class="menu_links" onclick="displayData(11,1,0,'A')" onmouseover=""> A </a> 

I letto da qualche parte che ho bisogno di mettere:

onmouseover="cursor: hand (a pointing hand)" 

Ma non funziona per me.

Plus Non sono sicuro se questo è considerato JavaScript, CSS o semplicemente HTML.

+0

è css e l'evento onmouseover è un evento javascript. – Scott

+0

Non inserisci css direttamente in onmouseover = "". Inoltre, il cursore: la mano mentre si passa il mouse sopra il tuo link dovrebbe essere l'azione predefinita. Se questo non sta accadendo, potrebbe esserci un altro problema a portata di mano. – Tank

+1

possibile duplicato di [come impostare lo stile del cursore sul puntatore per i collegamenti senza hrefs] (http://stackoverflow.com/questions/2409836/how-to-set-cursor-style-to-pointer-for-links-without- hrefs) –

risposta

331
<a class="menu_links" onclick="displayData(11,1,0,'A')" onmouseover="" style="cursor: pointer;"> A </a> 

E 'css.

O in un foglio di stile:

a.menu_links { cursor: pointer; } 
+4

grazie mille –

+1

solo un piccolo refuso - 'cursor: pointer;'. Ho provato a modificare il post, ma ho chiesto di modificare almeno 6 caratteri che penso. Oltre a questo, grazie! –

+2

Dopo aver provato questo, sembra che sia necessario avere onmouseover = "" AND style = cursor: pointer; ".Se hai solo il tag di stile, il puntatore del puntatore del mouse sparirà/default al puntatore standard dopo un'interazione con un clic. Buon post Scott, grazie. – DnfD

37

È possibile farlo in CSS:

a.menu_links { 
    cursor: pointer; 
} 

Questo è in realtà il comportamento predefinito per i collegamenti. È necessario averlo in qualche modo sovrascritto altrove nel tuo CSS, oppure non c'è un attributo href lì (manca nel tuo esempio).

+0

non ho un href coz non voglio lasciare la pagina. è un link che attiva una funzione JS e se inserisco href = "#" lo mette in disordine e ricarica la pagina sbagliata –

+2

@DvirLevy - Quindi, restituisci false e usa 'href =" # "', o usa semplicemente il CSS come ti ho mostrato ... –

3

Aggiungere un attributo href per renderlo un collegamento valido & return false; nel gestore eventi per impedire che causi una navigazione;

<a href="#" class="menu_links" onclick="displayData(11,1,0,'A'); return false;" onmouseover=""> A </a> 

(O fare displayData() return false e ..="return displayData(..)

8

in css scrittura

a.menu_links:hover{ cursor:pointer} 
17

Mi piace usare questo uno se ho solo un link sulla pagina:

onMouseOver="this.style.cursor='pointer'" 
7

Qui è qualcosa di bello se vuoi fare il massimo con questo. nell'url, puoi usare un link o salvare un'immagine png e usare il percorso. ad esempio:

url ('assets/imgs/theGoods.png');

sotto è il codice:

.cursor{ 
    cursor:url(http://www.icon100.com/up/3772/128/425-hand-pointer.png), auto; 
} 

Quindi questo funzionerà solo sotto le dimensioni 128 x 128, qualsiasi carico più grande e l'abitudine dell'immagine. Ma puoi praticamente usare qualsiasi immagine tu voglia! Questo sarebbe considerato puro css3 e alcuni html. tutto quello che devi fare in html è

<div class='cursor'></div> 

e solo in quel div, quel cursore mostrerà. Quindi di solito lo aggiungo al tag del corpo.

4

Penso che la "risposta migliore" sopra, anche se accurata dal punto di vista programmatico, in realtà non risponda alla domanda posta. la domanda chiede come cambiare il puntatore nell'evento mouseover. Vedo post su come si possa avere un errore da qualche parte non risponde alla domanda. Nella risposta accettata, l'evento mouseover è vuoto (onmouseover="") e l'opzione di stile, invece, è inclusa. Sconcertante perché questo è stato fatto.

Potrebbe non esserci nulla di sbagliato nel collegamento dell'indagine. considerare il seguente codice HTML:

<a id=test_link onclick="alert('kinda neat);">Click ME!</a> 

Quando di un topo utente su questo link, il puntatore non si trasforma in una mano ... invece, il puntatore si comporta come se fosse in bilico su di testo normale. Uno potrebbe non volere questo ... e così, il puntatore del mouse deve essere detto di cambiare.

la risposta ricercato per è questo (che è stato pubblicato da un altro):

<a id=test_link onclick="alert('Nice!');" 
     onmouseover="this.style.cursor='pointer';">Click ME!</a> 

Tuttavia, questo è un incubo ... se hai un sacco di questi, o utilizzare questo genere di cose tutto il luogo e decide di fare una specie di cambiamento o di imbattersi in un bug. meglio fare una classe CSS per esso:

a.lendhand { 
    cursor: pointer; 
} 

poi:

<a class=lendhand onclick="alert('hand is lent!');">Click ME!</a> 

ci sono molti altri modi che sarebbe, forse, meglio di questo metodo. DIV s, BUTTON s, IMG s, ecc potrebbe rivelarsi più utile. Non vedo alcun danno nell'uso di <a>...</a>, però.

jarett.

1

Soluzione tramite puro CSS come indicato nella risposta contrassegnata come la migliore non è adatto per questa situazione.

L'esempio in questo argomento non ha un attributo href statico normale, chiama solo JS, quindi non farà nulla senza JS.

Quindi è bene accendere il puntatore solo con JS. Quindi, la soluzione

onMouseOver="this.style.cursor='pointer'" 

come detto sopra (ma non posso commentare lì) è il migliore in questo caso. (Ma sì, in generale, per i normali link che non richiedono JS, è meglio lavorare con CSS puro senza JS.)