멋진 jQuery 배너 광고를 만들려고합니다. 내 콘텐츠의 스타일은 다음과 같습니다.jQuery fadeOut이 작동하지 않습니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Open House : Banner Advertisements</title>
<style type="text/css">
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
body { background:#0D3405; }
#container
{
background:#000;
width:895px;
margin:25px auto;
border:solid 2px #666;
color:#eee;
padding:15px;
min-height:600px;
}
.leaderboard
{
width: 895px;
min-height:150px;
max-height:150px;
background: #FFFFFF; //url('_images/01Slide_600x300.jpg') no-repeat;
overflow:hidden;
position:relative;
top:20px;
}
.skyscraper
{
width: 150px;
min-height:600px;
background:#FFFFFF;
position:fixed;
margin-left:5px;
overflow:hidden;
}
#tiger
{
margin-left:-160px;
}
#banner1 img
{
position:relative;
height:100px;
margin-top:150px;
margin-right:180px;
}
</style>
<script type="text/javascript" src="_scripts/modernizr.min.js"></script>
</head>
<body>
<div id = "banner2" class = "skyscraper">
<img id = "tiger" src = "_images/tiger_2.png" alt = "_images/saveTiger.jpg">
</div>
<div id = "container">
<div id = "banner1" class = "leaderboard">
<h1>free smartphones</h1>
<img id = "android1" src = "_images/android.png">
<img id = "android2" src = "_images/blackberry.png">
<img id = "android" src = "_images/android2.png">
</div> </br>
</div>
</body>
<script type = "text/javascript" src = "_scripts/jquery.min.js"></script>
<script type = "text/javascript" charset = "utf-8">
$(document).ready(function() {
saveTheTiger();
})
function saveTheTiger()
{
$('#tiger').fadeOut(1000);
//animate({'margin-left':'100px'},1000);
}
function banner1adsequence()
{
smartphones();
}
</script>
</html>
사실, fadeOut이 작동하지 않습니다. 주석 처리 된 애니메이션 기능을 알게되면 작동합니다. 드라이브를 테스트하고 ID가 호출되고 작동하는지 확인해야합니다.
여기에 무엇이 있는지 정확히 알 수 있습니까?
감사
나를위한 작품 : http://jsfiddle.net/6Q49q/ –
CSS 규칙에 따라 이미지가 화면에 표시되지 않았습니까? 이 경우 "작동하지 않는"것은 무엇을 의미합니까? 이미지가 전혀 표시되지 않거나 페이드 아웃되지 않습니까? 오류? – JJJ
'fadeIn'은 우연히 작동합니까? 어떤 브라우저/버전에서 실행 하시겠습니까? –