Question

我试图为我自己的实践/喜悦做的Im项目撰写一个没有J Query的横向梯子。

相关法典:

function moveit() {
    "use strict";
    document.getElementById("position").style.left = window.event.clientX + "px";
}

window.onload = function () {
    "use strict";
    findtime();
    document.getElementById("scrollbar").style.width = document.getElementById("thevideo").offsetWidth + "px";
    var mousemove;
    document.getElementById("scrollbar").onclick = function () {
            mousemove = window.setInterval("moveit()", 1000);
    };
    document.getElementById("scrollbar").mouseup = function () {
            window.clearInterval(mousemove);
    };
};

不用说我有问题。它经常产生 Chrome、 Firefox、 Firefox等错误:

Uncaught TypeError: Cannot read property  clientX  of undefined

然而,如果我掌握以下法典的话,它就能够发挥作用(但对于采取改变立场并不有用):

document.getElementById("position").style.left = 12 + "px";

传真如下:

<?php include("header.php"); ?>
            <div>
                    <video id="thevideo">
                            <source src="movie.ogv" type="video/ogg" />
                    </video>
            </div>
            <div>
                    <span id="currenttime" contenteditable="true">0:00</span> / <span id="totaltime"></span>
            </div>
            <div id="scrollbar">
                    <div id="position" draggable="true"></div>
            </div>
<?php include("footer.php"); ?>

Answer 1

这里是我回来的,或许你可以调整该方案。

var scrollTimer;

function Timer(callback, delay) {
    var timerId, start, remaining = delay;
    this.pause = function() {
        window.clearTimeout(timerId);
        remaining -= new Date() - start;
    };
    this.resume = function() {
        start = new Date();
        timerId = window.setTimeout(callback, remaining);
    };
    this.resume();
}

function scroll(down) {
  var scrollframe = document.getElementById("contentframe");
  var curY = document.all?
    scrollframe.contentWindow.document.body.scrollTop
  : scrollframe.contentWindow.window.pageYOffset;
  var delta = 5;
  var newY = down? curY+delta : curY-delta;
  scrollframe.contentWindow.scrollTo(0,newY);
}

function autoscroll(down) {
  scroll(down);
  scrollTimer = new Timer(function() {
    autoscroll(down);
  }, 20);
}

function stopscroll() {
  scrollTimer.pause();
}

功能滚动(行向)产生一个单一<代码>delta向上或向下向上向上向上向上向上向上向上向上向上向上向上向上向上向上向上向上向上向上向上向上向上滚动向(。时间被用来重复这一行动,这里是你如何使用:

<a href=#>
<img src="scroller/arrowTop.png" title="Scroll Up"
    onMouseOver="autoscroll(false);" onMouseOut="stopscroll();"/>
</a>

希望这一帮助。

Answer 2

你们几乎在那里——在标准联合材料中没有<代码>window.event的物体。 http://developer.mozilla.org/en/DOM/event#DOM_Event_interface”rel=“nofollow” DOM Activities Interface:

function moveit(e) {
    "use strict";
    document.getElementById("position").style.left = e.clientX + "px";
}

window.onload = function (e) {
    "use strict";
    findtime();
    document.getElementById("scrollbar").style.width = document.getElementById("thevideo").offsetWidth + "px";
    var mousemove;
    document.getElementById("scrollbar").onclick = function () {
            mousemove = window.setInterval(moveit, 1000);
    };
    document.getElementById("scrollbar").mouseup = function () {
            window.clearInterval(mousemove);
    };
};

友情链接