elliottbenzle
asked on
jquery how to stop a queue from processing
on this page: http://triadtestsite.com/triadinc/header-fixed/meet-triad.php
if you mouse over the people too quickly the queue will continue from past events and creates a flashing grey bar at the top of the screen. Is there a way to stop the myQueue on a new mouseover event to prevent the bar from appearing?
Any ideas would be very helpful.
Thanks
if you mouse over the people too quickly the queue will continue from past events and creates a flashing grey bar at the top of the screen. Is there a way to stop the myQueue on a new mouseover event to prevent the bar from appearing?
Any ideas would be very helpful.
Thanks
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TriAd Marketing & Media | Meet Triad</title>
<?php require_once('includes.php'); ?>
<!-- begin script for person info overlay -->
<script type='text/javascript'>
function headerReset(){
$("div.header-container").delay(400, "myQueue").queue("myQueue", function(){
$(this).css('z-index','15');
}).dequeue("myQueue");
};
function headerSet(){
$("div.header-container").css('z-index','-1000');
};
$(document).ready(function(){
$("div.elliott-hover-area").hover(
function() {
headerSet();
$("div.elliott").stop().animate({"opacity": "1"}, "slow");
$("div.elliott").css('z-index','100');
// uncomment below to fade on mouseout
},function() {
$("div.elliott").stop().animate({"opacity": "0"}, "slow");
headerReset();
// $("div.header-container").delay(1000).css('z-index','15');
});
$("div.bob-hover-area").hover(
function() {
headerSet();
$("div.bob").stop().animate({"opacity": "1"}, "slow");
$("div.bob").css('z-index','100');
// uncomment below to fade on mouseout
},function() {
$("div.bob").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.shaw-hover-area").hover(
function() {
headerSet();
$("div.shaw").stop().animate({"opacity": "1"}, "slow");
$("div.shaw").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.shaw").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.jerry-hover-area").hover(
function() {
headerSet();
$("div.jerry").stop().animate({"opacity": "1"}, "slow");
$("div.jerry").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.jerry").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.mark-hover-area").hover(
function() {
headerSet();
$("div.mark").stop().animate({"opacity": "1"}, "slow");
$("div.mark").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.mark").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.crystal-hover-area").hover(
function() {
headerSet();
$("div.crystal").stop().animate({"opacity": "1"}, "slow");
$("div.crystal").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.crystal").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.eric-hover-area").hover(
function() {
headerSet();
$("div.eric").stop().animate({"opacity": "1"}, "slow");
$("div.eric").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.eric").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.dubs-hover-area").hover(
function() {
headerSet();
$("div.dubs").stop().animate({"opacity": "1"}, "slow");
$("div.dubs").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.dubs").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.david-hover-area").hover(
function() {
headerSet();
$("div.david").stop().animate({"opacity": "1"}, "slow");
$("div.david").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.david").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.janine-hover-area").hover(
function() {
headerSet();
$("div.janine").stop().animate({"opacity": "1"}, "slow");
$("div.janine").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.janine").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.spike-hover-area").hover(
function() {
headerSet();
$("div.spike").stop().animate({"opacity": "1"}, "slow");
$("div.spike").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.spike").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.dave-hover-area").hover(
function() {
headerSet();
$("div.dave").stop().animate({"opacity": "1"}, "slow");
$("div.dave").css('z-index','100');
// uncomment below to fade on mouseout
},function() {$("div.dave").stop().animate({"opacity": "0"}, "slow");
headerReset();
});
$("div.people-overlay").click(
function() {
$("div.people-overlay").stop().animate({"opacity": "0"}, "slow");
$("div.elliott").css('z-index','');
$("div.bob").css('z-index','');
$("div.shaw").css('z-index','');
$("div.jerry").css('z-index','');
$("div.mark").css('z-index','');
$("div.crystal").css('z-index','');
$("div.eric").css('z-index','');
$("div.dubs").css('z-index','');
$("div.david").css('z-index','');
$("div.janine").css('z-index','');
$("div.dave").css('z-index','');
$("div.spike").css('z-index','');
// uncomment below to fade on mouseout
// },function() {$("div.elliott").stop().animate({"opacity": "0"}, "slow");
});
});
</script>
<!-- end scrit for person info overlay -->
</head>
<body>
<?php require_once('header-meet-triad.php'); ?>
<div class="meet-triad-content">
<div id="meet-triad-tag-line"></div>
<!-- people info overlays -->
<div class="people-overlay spike">
<div class="light-blue-shadow">
The Lizard
</div>
<div class="skills">
The prince of pointy, crusher of crickets, governor of the glass<br />
terrarium and watcher in the night.
</div>
<div class="contact">
ph. 614-846-8761 (ask for the lizard)<br />
email. Spike don't do email
</div>
</div>
<div class="people-overlay elliott">
<div class="light-blue-shadow">
Web Design & Development Specialist
</div>
<div class="skills">
Knowledgable in HTML, CSS, Javascript, SQL, Server Management,<br />
ASP, .net, PHP, Wordpress, Joomla, AJAX, JQuery, Dreamweaver, <br />
Photoshop, Illustrator, eCommerce, GUI, and all that other computer stuff.
</div>
<div class="contact">
ph. 614-846-8761 ex. 12<br />
email. EBenzle@triad-inc.com
</div>
</div>
<div class="people-overlay bob">
<div class="light-blue-shadow">
Video Producer
</div>
<div class="skills">
Commandant of cameras, kingpin of killer shots, executive of<br />
editing and the viceroy of vicious video visualization.
</div>
<div class="contact">
ph. 614-846-8761 ex. 11<br />
email. BDawson@triad-inc.com
</div>
</div>
<div class="people-overlay shaw">
<div class="light-blue-shadow">
Media Strategist
</div>
<div class="skills">
Father of the blog, guru of getting the word out, dean of<br />
declarations, potentate of polished plans and top dog of typing.
</div>
<div class="contact">
ph. 614-846-8761 ex. 33<br />
email. MShaw@triad-inc.com
</div>
</div>
<div class="people-overlay jerry">
<div class="light-blue-shadow">
Editorial Director
</div>
<div class="skills">
Emperor of editorial, wizard of the written word, circulator<br />
of cultivated conversation and the genius of grammar.
</div>
<div class="contact">
ph. 614-846-8761 ex. 25<br />
email. JMarks@triad-inc.com<br />
email. editorial@triad-inc.com
</div>
</div>
<div class="people-overlay mark">
<div class="light-blue-shadow">
Advertising Sales Representative
</div>
<div class="skills">
Ringleader of representation, sultan of sales, director<br />
of directories and governor of good relations.
</div>
<div class="contact">
ph. 614-846-8761 ex. 27<br />
email. MWolf@triad-inc.com
</div>
</div>
<div class="people-overlay crystal">
<div class="light-blue-shadow">
Advertising Sales Representative
</div>
<div class="skills">
Superintendent of sales calls, a talker of the talk AND<br />
a walker of the walk, administrator of advertisements and<br />
czar of the corner office.
</div>
<div class="contact">
ph. 614-846-8761 ex. 38<br />
email. CVance@triad-inc.com
</div>
</div>
<div class="people-overlay eric">
<div class="light-blue-shadow">
Graphic Artist
</div>
<div class="skills">
Tee-shirt master, illustration domination,<br /> email blaster,
overlord of awesome and<br /> lover of Macs.
</div>
<div class="contact">
ph. 614-846-8761 ex. 32<br />
email. EBrown@triad-inc.com
</div>
</div>
<div class="people-overlay dubs">
<div class="light-blue-shadow">
Art Director
</div>
<div class="skills">
Creator of creativity, chieftain of design, luminary of<br />
layouts, pioneer of publications and eater of much cereal.
</div>
<div class="contact">
ph. 614-846-8761 ex. 17<br />
email. MDubs@triad-inc.com
</div>
</div>
<div class="people-overlay david">
<div class="light-blue-shadow">
Account Executive
</div>
<div class="skills">
The magnate of roadways, caesar of construction,<br /> the sealer
of deals, maker of plans, and<br />
wearer of the red cape.
</div>
<div class="contact">
ph. 614-846-8761<br />
email. DFinley@triad-inc.com
email. DFinley@vzw.blackberry.net
</div>
</div>
<div class="people-overlay janine">
<div class="light-blue-shadow">
Vice President of Creative Services
</div>
<div class="skills">
The bringer of light bulb ideas, conversation creator,<br />
builder of bridges, shaman of imagination, and spiritual leader.
</div>
<div class="contact">
ph. 614-846-8761 ex. 15<br />
email. Janine@triad-inc.com
</div>
</div>
<div class="people-overlay dave iefix">
<div class="light-blue-shadow">
President
</div>
<div class="skills">
Our fearless leader, the patriarch of possibilty,<br /> clearer
of new paths, founder of great ideas,<br />
and payer of the checks.
</div>
<div class="contact">
ph. 614-846-8761<br />
tf. 800.28.TRIAD<br />
email. DKeller@triad-inc.com
</div>
</div>
<!-- end people info overlays -->
<!-- hover area overlays -->
<div class="elliott-hover-area"></div>
<div class="bob-hover-area"></div>
<div class="shaw-hover-area"></div>
<div class="jerry-hover-area"></div>
<div class="mark-hover-area"></div>
<div class="crystal-hover-area"></div>
<div class="eric-hover-area"></div>
<div class="dubs-hover-area"></div>
<div class="david-hover-area"></div>
<div class="janine-hover-area"></div>
<div class="dave-hover-area"></div>
<div class="spike-hover-area"></div>
<!-- end hover area overlays -->
</div>
<!-- end meet-triad-content -->
<?php require_once('footer.php'); ?>
</body>
</html>ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.