Question

我是初学者 - 只是说。

我正在尝试在线提供不同的.js文件，我找到了typed.js。

但是当我滚动到页面的某个元素时，如果我有自己的网站并想要执行键入的代码会怎样？

我明白了：

<script type="text/javascript" src="js/typed.js"></script>
<script>
    $(function(){
                    $("#typed").typed({
                        strings: ["Are you somehow interested?"],
                        typeSpeed: 30
                    });
                });
</script>

在我的HTML文件的末尾。

当我到达特定div或h1或其他什么时，如何运行此代码？

有没有我可以学习如何操作的在线资源？

谢谢！

Answer 1

首先有一个方法可以检查用户是否按以下方式滚动到div：

interface Rules 
{
   //Something here. 
}

class Rules_IT implements Rules {

  const MYCONST_1 = 5;
  const MYCONST_2 = 3;
  const MYCONST_3 = 10;

  static public function myMethod(){
      return 'Something';
  }
}

class Rules_DE implements Rules {

  const MYCONST_1 = 3;
  const MYCONST_2 = 2;
  const MYCONST_3 = 15;

  static public function myMethod(){
      return 'Something different';
  }
}

然后将事件监听器添加到窗口滚动中，如下所示：

$class = 'Rules_' . $pattern; 

if( class_exists($class) )
{
    class_alias($class, 'Rules');
}

Answer 2

试试这个：

var hasScrolledPast = false;
window.onscroll = function() {
    if (window.scrollTop > whereYouWantToScrollDownTo && !hasScrolledPast) {
        hasScrolledPast = true;
        // do your code here.
    }
};

Answer 3

<script>

    $(window).on('scroll', function() {
        var y_scroll_pos = window.pageYOffset;
        var scroll_pos_test = 1800;             // set to whatever you want it to be

        if(y_scroll_pos > scroll_pos_test) {
    //do stuff
            $(function(){
                $("#typed").typed({
                    strings: ["Zainteresowany?"],
                    typeSpeed: 20
                });


            });
            setTimeout(function() {
                $(function(){
                    $("#typed2").typed({
                    strings: ["Skontaktuj się z nami!"],
                    typeSpeed: 20
                });})}, 4000);
        }
    });
</script>

这解决了等待执行另一个函数的问题，但现在又出现了另一个问题。

滚动时执行typed.js

3 个答案: