0

我使用了 Tats 在 JSFiddle 上发布的一些代码。它适用于 JSFiddle： http: //jsfiddle.net/FWWEn/397/ 但不适用于我的 html 页面。我在这些脚本标签之间插入了函数：

script type='text/javascript' src='http://code.jquery.com/jquery.min.js'

并将其插入到我的 .asp 文件末尾的/html标记之前。我插入的h1标签不起作用。为什么不？

<body>
<h1 align="center" bgcolor="#FFFFCC" width="800" class="style33" > Hours next week are 8:30am - 6:30pm. </h1>
</body>

<script type='text/javascript' src='http://code.jquery.com/jquery.min.js'>
function($) {
    $.fn.textWidth = function(){
         var calc = '<span style="display:none">' + $(this).text() + '</span>';
         $('body').append(calc);
         var width = $('body').find('span:last').width();
         $('body').find('span:last').remove();
        return width;
    };
    $.fn.marquee = function(args) {
        var that = $(this);
        var textWidth = that.textWidth(),
            offset = that.width(),
            width = offset,
            css = {
                'text-indent' : that.css('text-indent'),
                'overflow' : that.css('overflow'),
                'white-space' : that.css('white-space')
            },
            marqueeCss = {
                'text-indent' : width,
                'overflow' : 'hidden',
                'white-space' : 'nowrap'
            },
            args = $.extend(true, { count: -1, speed: 1e1, leftToRight: false }, args),
            i = 0,
            stop = textWidth*-1,
            dfd = $.Deferred();

        function go() {
            if(!that.length) return dfd.reject();
            if(width == stop) {
                i++;
                if(i == args.count) {
                    that.css(css);
                    return dfd.resolve();
                }
                if(args.leftToRight) {
                    width = textWidth*-1;
                } else {
                    width = offset;
                }
            }
            that.css('text-indent', width + 'px');
            if(args.leftToRight) {
                width++;
            } else {
                width--;
            }
            setTimeout(go, args.speed);
        };
        if(args.leftToRight) {
            width = textWidth*-1;
            width++;
            stop = offset;
        } else {
            width--;            
        }
        that.css(marqueeCss);
        go();
        return dfd.promise();
    };
            $('h1').marquee();
})(jQuery);
</script>

4

1 回答 1

0

除非存在源代码问题，否则使用设置了属性 src 的脚本标记将不会解释其中的代码。

所以只需像这样包含jquery：

 <script type='text/javascript' src='http://code.jquery.com/jquery.min.js'></script>

然后使用新的脚本标签来包含您的代码：

<script>
function($) {
    $.fn.textWidth = function(){
         var calc = '<span style="display:none">' + $(this).text() + '</span>';
         $('body').append(calc);
         var width = $('body').find('span:last').width();
         $('body').find('span:last').remove();
        return width;
    };

    $.fn.marquee = function(args) {
        var that = $(this);
        var textWidth = that.textWidth(),
            offset = that.width(),
            width = offset,
            css = {
                'text-indent' : that.css('text-indent'),
                'overflow' : that.css('overflow'),
                'white-space' : that.css('white-space')
            },
            marqueeCss = {
                'text-indent' : width,
                'overflow' : 'hidden',
                'white-space' : 'nowrap'
            },
            args = $.extend(true, { count: -1, speed: 1e1, leftToRight: false }, args),
            i = 0,
            stop = textWidth*-1,
            dfd = $.Deferred();

        function go() {
            if(!that.length) return dfd.reject();
            if(width == stop) {
                i++;
                if(i == args.count) {
                    that.css(css);
                    return dfd.resolve();
                }
                if(args.leftToRight) {
                    width = textWidth*-1;
                } else {
                    width = offset;
                }
            }
            that.css('text-indent', width + 'px');
            if(args.leftToRight) {
                width++;
            } else {
                width--;
            }
            setTimeout(go, args.speed);
        };
        if(args.leftToRight) {
            width = textWidth*-1;
            width++;
            stop = offset;
        } else {
            width--;            
        }
        that.css(marqueeCss);
        go();
        return dfd.promise();
    };
            $('h1').marquee();
})(jQuery);
</script>
于 2013-01-05T16:26:56.410 回答