轉換定位

我有一些代碼，我想集成到一個網站，並讓它在屏幕中間。這段代碼用Javascript做了一些淡化。但我無法像我想的那樣在屏幕上移動它。當我移動它時會混淆動畫。轉換定位

下面是HTML

<!DOCTYPE html>

jQuery的淡入通過一段JavaScript for（）循環

<div id="elem0" class="toBeFaded">Here's the first message...</div> 
    <div id="elem1" class="toBeFaded">We have second one here...</div> 
    <div id="elem2" class="toBeFaded">And here's the third message...</div> 
    <div id="elem3" class="toBeFaded">OMG!!! Here's the fourth message!</div> 

<script src="js/jquery-1.7.1.min.js"></script> 

<script src="js/fadeCode.js" defer="defer"></script>

的Javascript

$（函數（）{

var yourFade = 1, // the amount of time in seconds that the elements will fade in AND fade out 
    yourDelay = 2, // the amount of time in seconds that there will be a delay between the fade ins and fade outs 
    fadeTime = yourFade * 1000, //convert fade seconds to milliseconds (1000) 
    delayTime = yourDelay * 1000, // convert delay seconds to milliseconds (2000) 
    totalTime = fadeTime + delayTime, //3000 milliseconds...needed for all those delays we talked about 
    allElems, // find out exactly how many page elements have the 'toBeFaded' class (4) 
    elemNoFade, // Will help us find the last element represent the last element (3) 
    i, 
    fadingElem; 

for (i = 0, allElems = $('.toBeFaded').length, elemNoFade = allElems - 1; i < allElems; i+=1) { 
    fadingElem = "#elem" + i; 
    if (i === 0) { 
     $(fadingElem).fadeIn(fadeTime).delay(delayTime).fadeOut(fadeTime); 
    } else if (i === elemNoFade) { 
     $(fadingElem).delay(totalTime * i).fadeIn(fadeTime); 
    } else { 
     $(fadingElem).delay(totalTime * i).fadeIn(fadeTime).delay(delayTime).fadeOut(fadeTime); 
    } 
} });

和CSS

.toBeFaded { 
display: none; 
position:absolute; 
font-size:70pt;

}

和link到的jsfiddle

來源

2012-07-12 Micah Armantrout

CSS3動畫是一個選項嗎？ – 2012-07-13 00:12:52

不，我願意這樣做 – 2012-07-13 00:13:35

好的。你能在jsFiddle上放一些代碼嗎？ – 2012-07-13 00:17:27

我不知道我看到了問題。看看這個小提琴：http://jsfiddle.net/joplomacedo/6xfKN/375/

來源

2012-07-13 00:36:58 banzomaikaka

多數民衆贊成在很好......我最終問了錯誤的問題......我可以問另一個問題，如果你想，但我希望它繼續旋轉通過你知道該怎麼做？ – 2012-07-13 00:38:14

旋轉動畫？ – banzomaikaka 2012-07-13 00:38:57

是的，雖然旋轉 – 2012-07-13 00:40:02

回答

相關問題