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>

この関数は、画像がクリックされたときに呼び出されます。私の考えは、基本的に、位置の値が0未満の場合、divに画面上でアニメーション化するように指示することでした。これは、画面から外れていることを示していると思います。値が画面外にあることが検出されない場合は、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 に答える