Доброе время суток. Написал на скорую руку скрипт, а он работает только в опере. Я не понимаю почему может быть кто нибудь подскажет?
Архив
<script type="text/javascript">
var img=["new_version.jpg","turnament.jpg","win.jpg","pll.jpg","new_happy.jpg","fantsia.jpg"];
function create(){
var news=['Вышла новая версия', 'Состоиться турнир', 'Победители турнира', 'Наша команда пополнилась', 'С новым годом', 'Привет, фантазия исякла'];
for(var i=0; i<news.length; i++){
var parentdiv=document.getElementById('news');
var div = document.createElement('div');
div.id = 'news_text';
div.onmouseover='MouseOver('+i+')';
parentdiv.appendChild(div);
div.innerHTML='<p class="news_text">'+news[i]+'</p>';
}
for(i=0; i<img.length; i++){
var parentimg=document.getElementById('news_img');
var images=document.createElement('img');
images.id='img'+i;
images.className='img_news';
images.src='img/'+img[i];
if(!i==0) images.style.display='none';
parentimg.appendChild(images);
}
}
function MouseOver(over) {
for(i=0; i<img.length; i++){
var images=document.getElementById('img'+i);
if(over==i){
images.style.display='inline';
}
else{images.style.display='none'; }
}
}
</script>
<style>
* {
margin:0 0px;
}
#news {
background-color:#CCC;
width:700px;
height:350px;
margin:0 auto;
z-index:0;
}
#news_img {
width:350px;
height:350px;
}
.img_news {
width:300px;
height:300px;
margin:25px 25px 25px 25px;
border:black solid 1px;
}
#news_text {
border: #FFF dashed 1px;
background-color:#0CF;
width:350px;
height:45px;
text-align:left;
position:relative;
left:330px;
top:-325px;
margin-top:3px;
}
.news_text {
margin:13px 10px;
font-size:18px;
}
#about {
background-color:#CCC;
width:302px;
height:100px;
position:absolute;
opacity: 0.7;
filter: alpha(opacity=70);
top:250px;
left:315px;
}
</style>
</head>
<body onload="create()">
<div id="news">
<div id="news_img"></div>
<div id="about"></div>
</div>
</body>
</html>
Спасибо.