Bug Tracker

Opened 8 years ago

Closed 8 years ago

#7980 closed bug (invalid)

Accumulating Time

Reported by: calmonrib@… Owned by:
Priority: low Milestone: 1.next
Component: unfiled Version: 1.4.4
Keywords: Cc:
Blocked by: Blocking:

Description

I'm creating a basic lightbox effect. I have a link that when I click it opens the lightbox normally, but when I click on the transparency of the Lightbox to close, it closes and it adds more time, and next time I click to close again it takes longer to disappear.

Example:
1º - Click on the link
2º - Hold open the lightbox
3º - Click on transparency to close
4º - Repeat the process 4 times or less and you'll notice it takes longer to stop disappearing.

Look full code - http://pastebin.com/Bz6Zb8Qs

or here:

<html>
<head>
<title>- Plugin jQuery</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
/****************************************************/

var scrollbody = false;
var tempoa = 600;
var tempos = 600;
var tempoav = 400;
var temposv = 400;
var opacidade = 0.7;
var altura = 400;
var largura = 600;
var texto = $("#click").attr('rel');
var link  = $("#click").attr('href');
var cor = "#000";

/****************************************************/
$("body").append('<div class="teste"></div><div class="box"><div class="geral"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"><embed class="video" type="application/x-shockwave-flash" src="" width="'+largura+'" height="'+altura+'"></embed></object></div><div class="titulo"></div></div>');
/****************************************************/

$(".titulo").html('<p>'+texto+'</p>');

$(".box").css({
   "height" : altura+30,
   "width" : largura+30
});
$(".geral").css({
   "height" : altura+30,
   "width" : largura+30
});
$(".teste").css({
  "background-color" : cor,
  "opacity" : opacidade
});
/****************************************************/

$("#click").click(function(event){
event.preventDefault();
$(".video").attr('src', link);
/****************************************************/

/*if (scrollbody == false){
  $("body").css({
    "overflow" : "hidden"
    });
    } else {
    $("body").css({
      "overflow" : "visible"
      });
    }*/

/****************************************************/
$(".teste").fadeIn(tempoa, function(){
  $(".box").fadeIn(tempoav, function(){
     $(".box").animate({
        height: '+=50'
     }, 300, 'linear', function(){
       $(".titulo").fadeIn('slow');
     });
  });
});

/****************************************************/

       $(".teste").click(function(){
         $(".teste").fadeOut(tempos, function(){
           $(".titulo").fadeOut(temposv, function(){
               $(".box").animate({
               height: altura+30
               }, 300, 'linear', function(){
                 /*if (scrollbody == false){
                 $("body").css({
                   "overflow" : "visible"
                   });
                   }*/
                 $(this).fadeOut(temposv);
               });
         });
         });
         });

/****************************************************/
   });
});
</script>
<style>
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
:focus {
    outline: 0;
}
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

.teste {
position:fixed;
width:100%;
height:100%;
top: 0;
left:  0;
z-index:9999;
display: none;
}

.fundo {
  height: 600px;
  width: 800px;
  margin: auto;
}

.box {
position: fixed;
background-color: #000;
z-index: 9999;
display: none;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
border-radius: 9px;
-o-border-radius: 9px;
-icab-border-radius: 9px;
-khtml-border-radius: 9px;
-moz-border-radius: 9px;
-webkit-border-radius: 9px;
padding: 10px;
}
.geral {
background-color:#fff;
margin: auto;
border-radius: 9px;
-o-border-radius: 9px;
-icab-border-radius: 9px;
-khtml-border-radius: 9px;
-moz-border-radius: 9px;
-webkit-border-radius: 9px;
top: 0;
left: 0;
right: 0;
bottom: 0;
text-align:center;
}
.video {
  margin-top: 15px;
}


.titulo{
  height: 30px;
  width: 600px;
  color: #FFFFFF;
  padding-top: 5px;
  display: none;
}
</style>
</head>
<body>
<div class="fundo">
<a href="http://www.youtube.com/v/OigUqkBEV5w" id="click" rel="Darwinismo - Parte 1">Darwinismo - Parte 1</a>
<br /><p></p>
</div>
</body>
</html>

Change History (1)

comment:1 Changed 8 years ago by jitter

Priority: undecidedlow
Resolution: invalid
Status: newclosed

This bug report contains way too much code to be easily debuggable. Also it is based on jQuery 1.4.2 (the current stable is 1.4.4. The beta 1.5b1 is also available).

If you are sure this is a jQuery bug please provide a reduced test case according to the [Bug reporting guidelines. And we will happily reopen the ticket and investigate the issue further.


If this was meant to be a support request: The jQuery bug tracker is not for support requests. Please use the jQuery Forum for support requests or try the #jquery irc channel on freenode

Note: See TracTickets for help on using tickets.