0
호버 메뉴가 불투명도 효과와 함께 제대로 작동했지만, 갑자기 표시된 이미지가 표시되지 않습니다. 텍스트의 움직임과 같은 다른 애니메이션은 작동 중이다 ...... Jquery에 대해 많이 모른다. 그래서 진지하게 여기에 갇혔다. You can see the website online if you need.. 메뉴에서 애니메이션 기능이 정지되었습니다. jquery
여기 코드를 붙여 넣으면 더 잘 볼 수 있습니다. 스팬의 애니메이션이 작동하지 않습니다.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="js/blockui.js">
</script>
<script type="text/javascript" src="js/easySlider1.7.js">
</script>
<script src="js/prettyPopin.js" type="text/javascript" charset="utf-8">
</script><!-- Let's do the animation -->
<script type="text/javascript">
//<![CDATA[
$(function() {
// set opacity to nill on page load
$("ul#menu span").css("opacity","0");
// on mouse over
$("ul#menu span").hover(function() {
// animate opacity to full
$(this).stop().animate({
opacity: 1
}, "slow");
},
// on mouse out
function() {
// animate opacity to nill
$(this).stop().animate({
opacity: 0
}, "slow");
});
});
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
$.blockUI({ css: {
border: 'none',
padding: '15px',
backgroundColor: '#FFF',
'-webkit-border-radius': '10px',
'-moz-border-radius': '10px',
opacity: .8,
color: '#FFFFF'
} });
setTimeout($.unblockUI, 1500);
});
</script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
$(".bullet li").hover(function(){
$(this).find('span').animate({ opacity: 0 }, 300);
$(this).find('a').animate({paddingLeft:"85px"}, 300);
},function(){
$(this).find('span').animate({ opacity: 1 }, 300);
$(this).find('a').animate({paddingLeft: "70px"}, 300);
});
});
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
$("#slider").easySlider({
speed:800,
pause:3000,
prevId: 'prevBtn',
nextId: 'nextBtn',
auto: true,
continuous: true
});
});
//]]>
</script>
<script type="text/javascript" charset="utf-8">
//<![CDATA[
$(document).ready(function(){
$("a[rel^='prettyPopin']:eq(0)").prettyPopin({width: 550,followScroll:false});
$("a[rel^='prettyPopin']:eq(1)").prettyPopin({width: 550,followScroll:false});
$("a[rel^='prettyPopin']:eq(2)").prettyPopin({width: 550,followScroll:false});
});
//]]>
</script><![if !(IE 6)]>
<link rel="stylesheet" type="text/css" href="my.css" /><![endif]><!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="myie.css" />
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="myie7.css" />
<![endif]-->
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="appoint">
<ul>
<li>For appointment:
+92-55-3856686<strong>|</strong>3859676<strong>|</strong>3846888</li>
</ul>
</div><!--appoint div close-->
<div id="navi">
<ul id="menu">
<li><a href="#" class="home"></a></li>
<li><a href="#" class="service"></a></li>
<li><a href="#" class="portfolio"></a></li>
<li><a href="#" class="contact"></a></li>
</ul>
</div><!--navigation div close-->
</div><!--header div close-->
여기가
/* Menu Body */
ul#menu {
height:39px;
list-style:none;
margin:0;
padding:0;
}
/* Float LI Elements - horizontal display */
ul#menu li {
float:left;
}
/* Link - common attributes */
ul#menu li a {
background:url(images/menu.png) no-repeat scroll top left;
display:block;
height:39px;
position:relative;
}
/* Span (on hover) - common attributes */
ul#menu li a span {
background:url(images/menu.png) no-repeat scroll bottom left;
display:block;
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
z-index:100;
}
/* Span (on hover) - display pointer */
ul#menu li a span:hover {
cursor:pointer;
}
/* Specify width and background position attributes specifically for the class: "home" */
ul#menu li a.home {
width:83px;
}
/* Shift background position on hover for the class: "home" */
ul#menu li a.home span {
background-position:0px -39px;
}
/* Specify width and background position attributes specifically for the class: "portfolio" */
ul#menu li a.service {
width:110px;
background-position:-83px 0px;
}
/* Shift background position on hover for the class: "portfolio" */
ul#menu li a.service span {
background-position:-83px -39px;
}
/* Specify width and background position attributes specifically for the class: "portfolio" */
ul#menu li a.portfolio {
width:104px;
background-position:-193px 0px;
}
/* Shift background position on hover for the class: "portfolio" */
ul#menu li a.portfolio span {
background-position:-193px -39px;
}
/* Specify width and background position attributes specifically for the class: "portfolio" */
ul#menu li a.contact {
width:210px;
background-position:-297px 0px;
}
/* Shift background position on hover for the class: "portfolio" */
ul#menu li a.contact span {
background-position:-297px -39px;
}
곧 저를 회신 해 주시기 바랍니다 내가 탐색을 위해 사용하고있는 CSS 자사의 긴급
ul # 메뉴에는 범위가 없습니다. jquery 코드를 사용하려고하는 범위는 정확히 어디입니까? –