如何在页面加载时使文本向右滑动？答案

【问题标题】：How do I make text slide to the right upon page load?如何在页面加载时使文本向右滑动？
【发布时间】：2013-09-23 16:41:39
【问题描述】：

我不精通 javascript，我正在尝试编辑 this example at w3schools 以在页面加载时将 div 内的简单标题平滑地向右滑动（从视野之外）。我只知道它与已经存在的代码有关，但我遇到了两个问题。

当我将框转为文本标题并将“div”选择器更改为“.headline”（或我命名的任何名称）时，单击按钮不会移动它。
如果我弄清楚了，我仍然不知道如何让它在没有按钮的情况下工作。

【问题讨论】：

标签： javascript jquery animation text sliding

【解决方案1】：

现在代码是通过点击处理程序调用的，只需删除它的包装器并在页面加载时执行它：

$(document).ready(function() {
    $(".header").animate({ //be sure to change the class of your element to "header"
        left:'250px',
        opacity:'0.5',
        height:'150px',
        width:'150px'
    });
});

演示：http://jsfiddle.net/tymeJV/ZWtQw/1/

【讨论】：

【解决方案2】：

如果你想在身体负荷时做到这一点，试试这些 100% 正常工作
html内容及编码如下：

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>

var function1 = function(){ 
$(document).ready(function(){
    $("div").animate({

      left:'250px',
      opacity:'0.5',
      height:'150px',
      width:'150px'
    });
});

};
</script> 
</head>

<body onload="function1();">

<p> in the body tag  i have added onload event which tells that when body is fully loaded then do this function which has a name of function1 or you can name something else but remember <b>in script tag the name after var should be same as the name in onload event   </b></p>
<div style="background:#98bf21;height:100px;width:100px;position:absolute;">
</div>

</body>
</html>

【讨论】：

你可以详细说明它们是如何/为什么以他们的方式工作的，可能是一个 jsfiddle。