Тестирование ссылок Jquery вне Google Chrome

0

Есть ли другой способ проверить ссылку jquery, кроме проверки элемента в google chrome? Я сделал это и думал, что это проблема, поскольку она не смогла загрузить ссылки, но я исправил ее, и она все равно не будет делать то, что я говорю ей, в частности, функция show не будет делать анимации Я уточняю. Однако скрыть все отлично, и работает вращающийся текст. У меня такие проблемы с 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>

CSS:

#content {
    background-color: #030505;
    height:100%;
    width:100%;
}

#list{
    height:100%;
    width:100%;
    position:relative;
    margin:0 auto;
    overflow:hidden;
}

#list ul, #list li{
    list-style:none;
    margin:0;
    padding:0;
}

#list a{
    position:absolute;
    text-decoration: none;
    color: #444444;
}
#list a:hover{
    color: #EB7500;
}

#background {
    width: 100%;
    height: 100%;
    background-color: A3D8F4;
}

.col1 {
    display: block;
    width: 300px;
    height: 200px;
    border-style: dotted;
    margin: 0 auto;
    float: left;
}

.col2{
    display: block;
    width: 300px;
    height: 200px;
    border-style: solid;
    margin: 0 auto;
    float: left;
}

.col3{
    display: block;
    width: 300px;
    height: 200px;
    border-style: solid;
    margin: 0 auto;
    float: left;
}

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 работал отлично! Я экспериментировал со всеми вариантами шоу. Я не уверен, что происходит сейчас, я надеюсь, что это просто некоторая ошибка ссылки, которую я не могу найти в части элемента проверки, или есть какая-то другая лучшая практика, которую кто-то может знать, которая может помочь мне исправить это и избежать эта проблема в будущем. Спасибо!

  • 0
    Возможно, см. Также stackoverflow.com/a/22867166/2801559
  • 0
    вот и все, спасибо большое! И это все еще не работает! Я никогда даже не думал, что это может быть API. Как долго они обычно вниз?
Показать ещё 1 комментарий

1 ответ

0

Вы связываете Jquery-ui min после jscript.js. Возможно, вы захотите поставить его перед jscript.js. Это может решить проблему.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню