【问题标题】:PHP - Text fading effect?PHP - 文本褪色效果?
【发布时间】:2010-10-06 21:08:12
【问题描述】:

我一直在研究这个,基本上我有一个显示“eco'texthere';'的表格发布数据后。

如何使文本淡入,例如:

表格 ---> 用户使用提交按钮发送数据 ---> 显示返回消息“轮换数据” ---> 现在文本淡入显示“成功发送”。 (在 PHP 中主要使用 echo)。

我需要一个超时函数和 Jquery 吗?

【问题讨论】:

  • 用户体验与 PHP 有什么关系?如果我正确理解您的问题,您只是希望您的文字淡出并最终消失。那是 JavaScript/CSS 的东西。
  • 基本上,它在 php 中显示 1 条回显消息,然后在 6 秒后消失并显示另一条。

标签: javascript ajax animation effects


【解决方案1】:

你需要像上面推荐的那样导入一个 jQuery 库......然后你有类似的东西:

$.get("yourphpscript.php",function(response){
    $("#somediv").html(response).fadeIn('slow');
});

div #somediv 应该以 display:none; 开头。

【讨论】:

    【解决方案2】:

    是的 - PHP 在您能够向用户显示响应时执行完毕。您可能希望获取该 PHP 响应(通过 AJAX),将其放入 DOM 元素(如 div)中,然后在 AJAX 调用完成后使用 jQuery 为该 DOM 元素设置动画。

    【讨论】:

    • 实际上这取决于您使用的服务器。如果您使用的是 IIS,那么当您看到任何内容时,php shurely 就完成了工作,因为它默认激活了输出缓冲。如果你有一个 appache,那么你只需在代码中执行 flush() 以及使用 echo 执行的任何输出;无论php的实际处理状态如何,都会发送给客户端。
    • 是的,没错,我是在笼统地说。无论如何,在这个特定的示例中没有“彗星/推动”状态 - 尝试使用 PHP 来制作这样的动画显然是徒劳的。 ;)
    • 我如何将“echo”与 Jquery 结合使用淡入和消失?
    【解决方案3】:

    您可以使用 Mootools 代替 jQuery:

    http://mootools.net/docs/core/Fx/Fx.Tween

    【讨论】:

    • 我如何将“echo”与 Jquery 结合使用淡入和消失?
    【解决方案4】:

    是的,因为这是一个客户端效果,我建议您研究 jQuery 来执行此操作,例如使用 fadeIn

    【讨论】:

    • 如何将“echo”与 Jquery 结合使用淡入和消失?
    【解决方案5】:

    如果不想使用 javascript,我发现这对我有用:

    <head>  
        <!-- Javascript -->
        <script type="text/javascript">
            function showHideLayer(id){
                e = document.getElementById(id);
                if(e.style.display=="block"){
                    e.style.display = "none";
                } else {
                    e.style.display = "block";
                }
            }
        </script> 
    </head>
    <body>
    <!-- Link zum Anzeigen/Verstecken -->
    <a href="alternativeLink" onclick="showHideLayer('myLayer');return(false)">Hide/Show</a>
    <div id="myLayer" style="display:none;">
        My hidden layer
    </div>
    

    【讨论】:

      猜你喜欢
      • 2017-07-29
      • 2012-08-24
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-09-19
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多