Welcome to WebmasterWorld Guest from

Forum Moderators: open

Message Too Old, No Replies

jQuery background fade

9:10 am on Oct 7, 2011 (gmt 0)

10+ Year Member

Once the video is clicked, I need the backgrounds to fade using the jQuery script below.
I've got a .click function going for the id="fade" but nothing is fading.
I tried the id="player", too.
The syntax is probably off but I show no errors.
The hover needs to go because the video is now clicked.
I'd appreciate the help before I'm bald.
Thank you.

$(".fadeArea, #seats").hover(function(){
$(this).stop().animate({"opacity": "0.25"}, 5000);
function() {
$(this).stop().animate({"opacity": "1"}, 5000);

<div class="fadeArea">


<p id="player" class="video"><a href="http://www.site.com/go/getflashplayer" target="_blank"> <u>You must upgrade your Adobe Flash Player to see this video</u></a></p>

<div id="fade" style="text-align:center; margin: auto">
<script type="text/javascript">var so = new SWFObject('http://site.com/videos/HD/player.swf','mpl','720','404','9.0.115');

<div><img id="seats" src="img/seats.jpg" style="width: 100%; height: 150px; margin-top: 515px"></div>
2:28 pm on Oct 7, 2011 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member

Have you tried inserting an alert() in your fade function to see if it ever gets called? I don't work with Flash, but I wouldn't be surprised if Flash objects do not pass clicks through to the browser.
5:23 pm on Oct 7, 2011 (gmt 0)

10+ Year Member

Yes...You're right. I inserted an alert...nothing. Is there any workaround?
12:04 am on Oct 8, 2011 (gmt 0)

10+ Year Member

At first, I was thinking of using an iframe. But now it works cross-browser if you simply replace .click with .mousedown

Thanks for the tip. Always best to do a little testing. I was quickly able to determine the browser not responding by calling on an alert from an id in the body tag itself.
3:31 am on Oct 8, 2011 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member

I'm glad you got it sorted. I wouldn't have expected mousedown to work either, frankly. All I knew was that in days gone by, Flash had a history of being grafted onto the screen. I was going to suggest that you dip your toes in the waters of HTML 5 and the <video> tag, again with no actual knowledge or experience on my part. Anyway, I just did a quick search and there is a lot of information about Flash and HTML 5 if you hit a dead end. Good luck!
4:22 am on Oct 8, 2011 (gmt 0)

10+ Year Member

Setting the video wmode to transparent somehow helps perhaps for older browsers.