Styjun

Importance of Building Credit Score?

Certain search in list

How do I prevent employees from either switching to competitors or opening their own business?

Is White controlling this game?

Union with anonymous struct with flexible array member

Extreme flexible working hours: how to control people and activities?

What is the actual quality of machine translations?

How can I tell the difference between unmarked sugar and stevia?

Mathematically, why does mass matrix / load vector lumping work?

Is it a problem if <h4>, <h5> and <h6> are smaller than regular text?

Why can't I use =default for default ctors with a member initializer list

Is using haveibeenpwned to validate password strength rational?

Inward extrusion is not working

Are there any important biographies of nobodies?

How is John Wick 3 a 15 certificate?

How to handle self harm scars on the arm in work environment?

Is it legal for a bar bouncer to confiscate a fake ID

Zeros of the Hadamard product of holomorphic functions

How to manually rewind film?

Does Disney no longer produce hand-drawn cartoon films?

Why can my keyboard only digest 6 keypresses at a time?

Longest bridge/tunnel that can be cycled over/through?

Is a lack of character descriptions a problem?

Thread Pool C++ Implementation

how can i limit the number of executions of fadeIn () and fadeOut () functions in jQuery?

Is there an “exists” function for jQuery?How can I format numbers as currency string in JavaScript?How can I upload files asynchronously?How do I check if an element is hidden in jQuery?How can I convert a string to boolean in JavaScript?How can I know which radio button is selected via jQuery?How can I get query string values in JavaScript?How to check whether a checkbox is checked in jQuery?How can I select an element with multiple classes in jQuery?How can I refresh a page with jQuery?

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;

0

I'v applied some fadeIn()/fadeOut() functions to my webpage,which are executed on mouseenter/mouseleave, but I'v noticed that if I drag in and drag out the cursor really fast for a multiple times the selected block keeps to appear/disapear for a few seconds after.

I'v tried to google some JQuery functions to fix it, but I haven't found anything.

 $('.navbar').mouseenter(function () 
 $(".context-box__blur").fadeIn(200).css('display', 'inline-block');
 $("span").fadeIn(200).css('display', 'inline-block');
);
 $('.navbar').mouseleave(function () 
 $("span").fadeOut(200);
 $(".context-box__blur").fadeOut(200);
);

How can fix it, or how can I limit the quantity of the function's executions by time?

javascript jquery fadein fadeout

share|improve this question

asked Mar 24 at 18:13

Roman KuuuRoman Kuuu

1

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Take a look at stop()
  
  – charlietfl
  Mar 24 at 18:22
  

  
  
  
  

add a comment | 

0

I'v applied some fadeIn()/fadeOut() functions to my webpage,which are executed on mouseenter/mouseleave, but I'v noticed that if I drag in and drag out the cursor really fast for a multiple times the selected block keeps to appear/disapear for a few seconds after.

I'v tried to google some JQuery functions to fix it, but I haven't found anything.

 $('.navbar').mouseenter(function () 
 $(".context-box__blur").fadeIn(200).css('display', 'inline-block');
 $("span").fadeIn(200).css('display', 'inline-block');
);
 $('.navbar').mouseleave(function () 
 $("span").fadeOut(200);
 $(".context-box__blur").fadeOut(200);
);

How can fix it, or how can I limit the quantity of the function's executions by time?

javascript jquery fadein fadeout

share|improve this question

asked Mar 24 at 18:13

Roman KuuuRoman Kuuu

1

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Take a look at stop()
  
  – charlietfl
  Mar 24 at 18:22
  

  
  
  
  

add a comment | 

I'v applied some fadeIn()/fadeOut() functions to my webpage,which are executed on mouseenter/mouseleave, but I'v noticed that if I drag in and drag out the cursor really fast for a multiple times the selected block keeps to appear/disapear for a few seconds after.

I'v tried to google some JQuery functions to fix it, but I haven't found anything.

 $('.navbar').mouseenter(function () 
 $(".context-box__blur").fadeIn(200).css('display', 'inline-block');
 $("span").fadeIn(200).css('display', 'inline-block');
);
 $('.navbar').mouseleave(function () 
 $("span").fadeOut(200);
 $(".context-box__blur").fadeOut(200);
);

How can fix it, or how can I limit the quantity of the function's executions by time?

javascript jquery fadein fadeout

share|improve this question

asked Mar 24 at 18:13

Roman KuuuRoman Kuuu

1

 $('.navbar').mouseenter(function () 
 $(".context-box__blur").fadeIn(200).css('display', 'inline-block');
 $("span").fadeIn(200).css('display', 'inline-block');
);
 $('.navbar').mouseleave(function () 
 $("span").fadeOut(200);
 $(".context-box__blur").fadeOut(200);
);

share|improve this question

asked Mar 24 at 18:13

Roman KuuuRoman Kuuu

1

share|improve this question

asked Mar 24 at 18:13

Roman KuuuRoman Kuuu

1

asked Mar 24 at 18:13

Roman KuuuRoman Kuuu

1

asked Mar 24 at 18:13

Roman KuuuRoman Kuuu

1

2 Answers
2

active

oldest

votes

0

fadeIn() and fadeOut() has a complete function that runs after fadeIn/fadeOut completed, you may disable fadein or out before the ohter one is not completed:

var wait = false;

function fadeOut()

 if(wait) return false; // previous action not complete, cancel fadeOut
 wait = true;
 $("span").fadeOut(200, function() wait = false; )


function fadeIn()

 if(wait) return false; // previous action not complete, cancel fadeIn
 wait = true;
 $("span").fadeIn(200, function() wait = false; )

share|improve this answer

answered Mar 24 at 18:23

Ashkan Mobayen KhiabaniAshkan Mobayen Khiabani

23.7k1968125

add a comment | 

0

It's the way how mouseenter() & mouseleave() works. Try using mouseover()& mouseout() instead.

$("p").mouseover(function()
 $("p").css("background-color", "yellow");
 );

 $("p").mouseout(function()
 $("p").css("background-color", "lightgray");
 );

https://jsfiddle.net/KyleMit/GR8sk/

This JSFiddle will give you a clear idea on how these mouse events work.

share|improve this answer

edited Mar 24 at 19:51

Zaytsev Dmitry

7172620

answered Mar 24 at 18:30

Ganesh PartheebanGanesh Partheeban

12

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55326940%2fhow-can-i-limit-the-number-of-executions-of-fadein-and-fadeout-functions-i%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

0

fadeIn() and fadeOut() has a complete function that runs after fadeIn/fadeOut completed, you may disable fadein or out before the ohter one is not completed:

var wait = false;

function fadeOut()

 if(wait) return false; // previous action not complete, cancel fadeOut
 wait = true;
 $("span").fadeOut(200, function() wait = false; )


function fadeIn()

 if(wait) return false; // previous action not complete, cancel fadeIn
 wait = true;
 $("span").fadeIn(200, function() wait = false; )

share|improve this answer

answered Mar 24 at 18:23

Ashkan Mobayen KhiabaniAshkan Mobayen Khiabani

23.7k1968125

add a comment | 

0

fadeIn() and fadeOut() has a complete function that runs after fadeIn/fadeOut completed, you may disable fadein or out before the ohter one is not completed:

var wait = false;

function fadeOut()

 if(wait) return false; // previous action not complete, cancel fadeOut
 wait = true;
 $("span").fadeOut(200, function() wait = false; )


function fadeIn()

 if(wait) return false; // previous action not complete, cancel fadeIn
 wait = true;
 $("span").fadeIn(200, function() wait = false; )

share|improve this answer

answered Mar 24 at 18:23

Ashkan Mobayen KhiabaniAshkan Mobayen Khiabani

23.7k1968125

add a comment | 

fadeIn() and fadeOut() has a complete function that runs after fadeIn/fadeOut completed, you may disable fadein or out before the ohter one is not completed:

var wait = false;

function fadeOut()

 if(wait) return false; // previous action not complete, cancel fadeOut
 wait = true;
 $("span").fadeOut(200, function() wait = false; )


function fadeIn()

 if(wait) return false; // previous action not complete, cancel fadeIn
 wait = true;
 $("span").fadeIn(200, function() wait = false; )

share|improve this answer

answered Mar 24 at 18:23

Ashkan Mobayen KhiabaniAshkan Mobayen Khiabani

23.7k1968125

var wait = false;

function fadeOut()

 if(wait) return false; // previous action not complete, cancel fadeOut
 wait = true;
 $("span").fadeOut(200, function() wait = false; )


function fadeIn()

 if(wait) return false; // previous action not complete, cancel fadeIn
 wait = true;
 $("span").fadeIn(200, function() wait = false; )

share|improve this answer

answered Mar 24 at 18:23

Ashkan Mobayen KhiabaniAshkan Mobayen Khiabani

23.7k1968125

answered Mar 24 at 18:23

Ashkan Mobayen KhiabaniAshkan Mobayen Khiabani

23.7k1968125

answered Mar 24 at 18:23

Ashkan Mobayen KhiabaniAshkan Mobayen Khiabani

23.7k1968125

0

It's the way how mouseenter() & mouseleave() works. Try using mouseover()& mouseout() instead.

$("p").mouseover(function()
 $("p").css("background-color", "yellow");
 );

 $("p").mouseout(function()
 $("p").css("background-color", "lightgray");
 );

https://jsfiddle.net/KyleMit/GR8sk/

This JSFiddle will give you a clear idea on how these mouse events work.

share|improve this answer

edited Mar 24 at 19:51

Zaytsev Dmitry

7172620

answered Mar 24 at 18:30

Ganesh PartheebanGanesh Partheeban

12

add a comment | 

0

It's the way how mouseenter() & mouseleave() works. Try using mouseover()& mouseout() instead.

$("p").mouseover(function()
 $("p").css("background-color", "yellow");
 );

 $("p").mouseout(function()
 $("p").css("background-color", "lightgray");
 );

https://jsfiddle.net/KyleMit/GR8sk/

This JSFiddle will give you a clear idea on how these mouse events work.

share|improve this answer

edited Mar 24 at 19:51

Zaytsev Dmitry

7172620

answered Mar 24 at 18:30

Ganesh PartheebanGanesh Partheeban

12

add a comment | 

It's the way how mouseenter() & mouseleave() works. Try using mouseover()& mouseout() instead.

$("p").mouseover(function()
 $("p").css("background-color", "yellow");
 );

 $("p").mouseout(function()
 $("p").css("background-color", "lightgray");
 );

https://jsfiddle.net/KyleMit/GR8sk/

This JSFiddle will give you a clear idea on how these mouse events work.

share|improve this answer

edited Mar 24 at 19:51

Zaytsev Dmitry

7172620

answered Mar 24 at 18:30

Ganesh PartheebanGanesh Partheeban

12

$("p").mouseover(function()
 $("p").css("background-color", "yellow");
 );

 $("p").mouseout(function()
 $("p").css("background-color", "lightgray");
 );

share|improve this answer

edited Mar 24 at 19:51

Zaytsev Dmitry

7172620

answered Mar 24 at 18:30

Ganesh PartheebanGanesh Partheeban

12

edited Mar 24 at 19:51

Zaytsev Dmitry

7172620

edited Mar 24 at 19:51

Zaytsev Dmitry

7172620

answered Mar 24 at 18:30

Ganesh PartheebanGanesh Partheeban

12

answered Mar 24 at 18:30

Ganesh PartheebanGanesh Partheeban

12