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