Sida 1 av 1
JQuery-fråga Problem Löst. Lösning bif.
Postat: 11 januari 2016, 18:12:51
av SeniorLemuren
Jag har gjort en jQuery som öppnar en informationsruta och sätter focus på ett inputfält on mouseover. Rutan tonas bort efter ett antal mS. Allt fungerar bra. för man musen in på inputfältet så öppnas och stängs inforutan snällt som den skall. Problemet är att om man fladrar kring med musen flera gånger över inputfältet så köas jQueryscriptet och inforutan kommer att ploppa upp flera gånger efter varandra även om musen är utanför rutan. Idé på hur man lösa detta?
Länk till exempel.
jQuery:
Kod: Markera allt
<script>
$(function(){
$('.form-control').on('mouseover', function(){
var infoId = $(this).attr('data-infoId');
var inputId = $(this).attr('data-inputId');
$( inputId).focus();
$(infoId).fadeIn(400).delay(400).fadeOut(1000);
});
});
</script>
Re: JQuery-fråga
Postat: 12 januari 2016, 01:32:27
av SeniorLemuren
Bump! Ingen som figurerat ut hur man gör?
Re: JQuery-fråga
Postat: 12 januari 2016, 01:54:52
av sodjan
Jag vet inte exakt hur man gör, men det som verkar saknas är en delay.
D.v.s att markören behöver ligga still i 0.5 sekund (eller så) innan
mouseover "triggar" så att säga.
Googlar lite på "jquery mouseover delay".........
Här verkar vara ett sådant exempel:
http://stackoverflow.com/questions/4357 ... over-event
En annan:
https://forum.jquery.com/topic/how-can- ... over-event
Och en med en exempelsida man kan köra (och kolla koden):
https://forum.jquery.com/topic/adding-a ... over-event
Re: JQuery-fråga
Postat: 12 januari 2016, 01:56:48
av sodjan
Många sidor hänvisar även till:
http://cherne.net/brian/resources/jquer ... ntent.html
vilket verkar lösa samma problem...
Re: JQuery-fråga
Postat: 12 januari 2016, 11:21:32
av papabear
Kan också rekomendera hover intent som jag kört med tidigare, och det funkade riktigt bra.
Re: JQuery-fråga
Postat: 12 januari 2016, 20:17:14
av SeniorLemuren
Så här blev det. Funkar kanon.
Kod: Markera allt
<script type="text/javascript">
$(function(){
var delay = 600, setTimeoutConst;
$(".form-control").mouseover(function(){
var inputId = $(this).attr('data-inputId');
var infoId = $(this).attr('data-infoId');
$(inputId).focus();
setTimeoutConst = setTimeout(function(){
$(infoId).fadeIn(100).delay(400).fadeOut(1000);
},delay);
}).mouseout(function(){
clearTimeout(setTimeoutConst );
});
});
</script>
Re: JQuery-fråga Problem Löst. Lösning bif.
Postat: 12 januari 2016, 20:55:02
av sodjan
Ah, du valde timer lösningen, ja det fanns ju också med bland alternativen...
Sidan du länkar till ger bara en "Enter Secure Area" sida...
Re: JQuery-fråga Problem Löst. Lösning bif.
Postat: 13 januari 2016, 01:15:43
av SeniorLemuren
Ajaj. Jag glömde ta bort inloggningsskriptet när jag uppdaterade sidan med den nya rutinen. Nu skall det funka.