1

我是编码新手,希望有人可以帮助我提高我绝望的编码技能。我正在尝试创建一个 div,它会在按下按钮时在屏幕上和屏幕上显示动画。这是我到目前为止所得到的......这可能是愚蠢的错误,但我想这就是这个网站的目的......给你

<!DOCTYPE html>
<html>
<head>

</head>
<body>
    <div id="test">Example Text</div>
 <script>
function myFunction()
{
    var position = test.position();
    if("#test".position<0)
    {  
    alert("hello");
    $("#test").animate({
    "left": 0
    },1000);
}else{
    $("#test").animate({
    "left": -15
    },1000);
});
}
</script>   



</body>
</html>

单击图像时调用此函数。我的想法是基本上告诉 div 如果它的位置值小于 0,则在屏幕上设置动画,我认为这告诉它它不在屏幕上。如果它没有检测到它的值在屏幕外,这意味着 div 目前在屏幕上,所以它应该动画掉。我将非常感谢任何人可以提供的任何帮助。首先十分感谢!

4

1 回答 1

4

干得好。

 <!DOCTYPE html>
 <html>
 <head>

 </head>
 <body>
<div id="test">TESTTEST</div>
<input type="button" name="myButton" value="Click Me" onclick="myFunction()" />   
 <script>     
 function myFunction()
{
var divPosition = $("#test").offset();
if(divPosition.left < 0 )
{ 
$("#test").animate({
"left": 0
},1000);
 }else{
$("#test").animate({
"left": -150
},1000);
};
}
 </script>
 </body>
 </html>  

和 CSS:

 #test{
     background-color:white;
     border:3px solid black;
     font-size:30px;
     position:absolute;
     left:-20%;
     top:10%;
 }

工作小提琴:http: //jsfiddle.net/KeE4h/48/

于 2013-02-05T13:44:00.260 回答