Javascript 在Google Chrome之外测试Jquery链接_Javascript_Jquery_Html_Css

Javascript 在Google Chrome之外测试Jquery链接

javascript jquery html css

Javascript 在Google Chrome之外测试Jquery链接,javascript,jquery,html,css,Javascript,Jquery,Html,Css,除了在google chrome中检查元素外，还有其他方法检查jquery链接吗？我已经这样做了，并认为这是问题，因为它无法加载链接，但我纠正了它，它仍然不会做我告诉它要做的事情，特别是显示功能不会做我指定的动画。不过，隐藏效果很好，旋转文本也很好。我有很多CSS或javascript问题，所以我唯一能想到的是我把我的jquery链接搞砸了，我一点也不知道我做了什么 HTML是： <!DOCTYPE><HTML> <head> <

除了在google chrome中检查元素外，还有其他方法检查jquery链接吗？我已经这样做了，并认为这是问题，因为它无法加载链接，但我纠正了它，它仍然不会做我告诉它要做的事情，特别是显示功能不会做我指定的动画。不过，隐藏效果很好，旋转文本也很好。我有很多CSS或javascript问题，所以我唯一能想到的是我把我的jquery链接搞砸了，我一点也不知道我做了什么

HTML是：

<!DOCTYPE><HTML>
    <head>
        <title>Mary</title>
        <meta charset="UTF-8"/>
        <link href="C://wamp/www/Projects/Resume/stylesheet.css" type="text/css" rel="stylesheet">
        <link href="C://wamp/www/jquery-ui-1.10.3.custom/css/Mary/jquery-ui-1.10.3.custom.min.css" type="text/css" rel="stylesheet">
        <script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'></script>
        <script type="text/javascript" src="C://wamp/www/Projects/Resume/jscript.js"></script>
        <script type="text/javascript" src="C://wamp/www/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
    </head>

<body>
<div id="content">
    <div id="list">
    <ul>
        <li><a href="#"></a></li>
        <li><a href="#"><small></small></a></li>
        <li><a href="#"></a></li>
        <li style="font-family:Andale Mono"><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li style="font-family:fantasy"><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li style="font-family: Bitstream Vera Sans Mono"><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"><mark></mark></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
    </ul>
</div> 
</div>


<div id="background">
            <div class="col1">text              
            </div>
            <div class="col1">text  
            </div>  
            <br />
            <br />
            <div class="col2">
                text
            </div>
            <div class="col2">
                <ol>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ol>   
            </div>
            <br />
            <br />
            <div class="col3">
                <ol>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                </ol>
            </div>
            <div class="col3">

            </div>
</div>


</body>
</html>

Javascript/Jquery是：

$(document).ready(function () {
    var element = $('#list a');
    var offset = 0;
    var stepping = 0.03;
    var list = $('#list');
    var $list = $(list);
        $list.mousemove(function (e) {
            var topOfList = $list.eq(0).offset().top;
            var listHeight = $list.height();
            stepping = (e.clientY - topOfList) / listHeight * 0.2 - 0.1;
});
for (var i = element.length - 1; i >= 0; i--) {
    element[i].elemAngle = i * Math.PI * 2 / element.length;
        }
    setInterval(render, 30);
function render() {
    for (var i = element.length - 1; i >= 0; i--) {
        var angle = element[i].elemAngle + offset;
            x = 120 + Math.sin(angle) * 10;
            y = 45 + Math.cos(angle) * 40;
            size = Math.round(40 - Math.sin(angle) * 20);
                var elementCenter = $(element[i]).width() / 2;
                var leftValue = (($list.width() / 2) * x / 100 - elementCenter) + "px"
                    $(element[i]).css("fontSize", size + "pt");
                    $(element[i]).css("opacity", size / 100);
                    $(element[i]).css("zIndex", size);
                    $(element[i]).css("left", leftValue);
                    $(element[i]).css("top", y + "%");
                }
                offset += stepping;
            }
});

$(function(){
    $('#content').click(function(){
        $(this).hide();
        $('#background').show();
    });
});

在修复链接的另一个问题之前，我引用了错误的CSS链接，jquery运行良好！我在尝试所有的节目选项。我不确定现在发生了什么，我希望这只是一些我在inspect element部分找不到的链接错误，或者有人可能知道一些其他最佳实践可以帮助我解决这个问题，并在将来避免这个问题。非常感谢

您正在jscript.js之后链接Jquery ui min。您可能希望将其放在jscript.js之前。这可以解决问题。

也许，请看，就是这样，非常感谢！但它仍然不起作用！我从没想过它可能是API。他们通常要休息多久？不确定。是否尝试或可能将文件保存到文件夹？

$(document).ready(function () {
    var element = $('#list a');
    var offset = 0;
    var stepping = 0.03;
    var list = $('#list');
    var $list = $(list);
        $list.mousemove(function (e) {
            var topOfList = $list.eq(0).offset().top;
            var listHeight = $list.height();
            stepping = (e.clientY - topOfList) / listHeight * 0.2 - 0.1;
});
for (var i = element.length - 1; i >= 0; i--) {
    element[i].elemAngle = i * Math.PI * 2 / element.length;
        }
    setInterval(render, 30);
function render() {
    for (var i = element.length - 1; i >= 0; i--) {
        var angle = element[i].elemAngle + offset;
            x = 120 + Math.sin(angle) * 10;
            y = 45 + Math.cos(angle) * 40;
            size = Math.round(40 - Math.sin(angle) * 20);
                var elementCenter = $(element[i]).width() / 2;
                var leftValue = (($list.width() / 2) * x / 100 - elementCenter) + "px"
                    $(element[i]).css("fontSize", size + "pt");
                    $(element[i]).css("opacity", size / 100);
                    $(element[i]).css("zIndex", size);
                    $(element[i]).css("left", leftValue);
                    $(element[i]).css("top", y + "%");
                }
                offset += stepping;
            }
});

$(function(){
    $('#content').click(function(){
        $(this).hide();
        $('#background').show();
    });
});