自定义Javascript图片垂直滚动库

YouYaX 发布于 2012/12/20 11:16
阅读 209
收藏 0

http://www.youyax.com/forum/Content-index-id-4056.shtml

< script > 
var movepic = {
    wrapID: "md",
    imgHeight: 67,
    num: 0,
    topmove: function() {
        if (movepic.num == 1) {
            return
        }
        movepic.num = 1;
        var list = document.getElementById(movepic.wrapID).getElementsByTagName("img");
        var ele = list[0].cloneNode(true);
        if (list.length > 5) {
            list[5].style.opacity = ′0′;
            list[5].style.filter = "alpha(opacity=0)";
            list[5].style.MozOpacity = ′0′
        }
        for (var i = 1; i < movepic.imgHeight + 1; i++) { (function() {
                var t = i;
                setTimeout(function() {
                    list[0].style.marginTop = -t + "px";
                    if (t == movepic.imgHeight) {
                        document.getElementById(movepic.wrapID).removeChild(list[0]);
                        var _list = document.getElementById(movepic.wrapID).getElementsByTagName("img");
                        _list[0].style.marginTop = 1 + "px";
                        if (_list.length > 5) {
                            document.getElementById(movepic.wrapID).appendChild(ele);
                            ele = _list[4]
                        } else {
                            ele.style.opacity = ′0′;
                            ele.style.filter = "alpha(opacity=0)";
                            ele.style.MozOpacity = ′0′;
                            document.getElementById(movepic.wrapID).appendChild(ele)
                        }
                        for (var _i = 0; _i <= 100; _i++) { (function() {
                                var _ii = _i;
                                setTimeout(function() {
                                    if (_ii == 100) {
                                        movepic.num = 0
                                    }
                                    ele.style.opacity = _ii / 100;
                                    ele.style.filter = "alpha(opacity=" + _ii + ")";
                                    ele.style.MozOpacity = _ii / 100
                                },
                                (_i + 1) * 20)
                            })()
                        }
                    }
                },
                (i + 1) * 10)
            })()
        }
    },
    bottommove: function() {
        if (movepic.num == 1) {
            return
        }
        movepic.num = 1;
        var list = document.getElementById(movepic.wrapID).getElementsByTagName("img");
        var ele = list[list.length - 1].cloneNode(true);
        for (var i = 1; i < movepic.imgHeight + 1; i++) { (function() {
                var t = i;
                setTimeout(function() {
                    list[0].style.marginTop = t + "px";
                    if (t == movepic.imgHeight) {
                        document.getElementById(movepic.wrapID).removeChild(list[list.length - 1]);
                        var _list = document.getElementById(movepic.wrapID).getElementsByTagName("img");
                        _list[0].style.marginTop = 1 + "px";
                        ele.style.opacity = ′0′;
                        ele.style.filter = "alpha(opacity=0)";
                        ele.style.MozOpacity = ′0′;
                        document.getElementById(movepic.wrapID).insertBefore(ele, _list[0]);
                        for (var _i = 0; _i <= 100; _i++) { (function() {
                                var _ii = _i;
                                setTimeout(function() {
                                    if (_ii == 100) {
                                        movepic.num = 0
                                    }
                                    ele.style.opacity = _ii / 100;
                                    ele.style.filter = "alpha(opacity=" + _ii + ")";
                                    ele.style.MozOpacity = _ii / 100
                                },
                                (_i + 1) * 20)
                            })()
                        }
                    }
                },
                (i + 1) * 10)
            })()
        }
    }
}
document.getElementById("tp").onclick = movepic.topmove;
document.getElementById("bp").onclick = movepic.bottommove; 
< /script>

加载中
0
小编辑
小编辑
这种代码应该发到 RunJS 上!
返回顶部
顶部