Наслагване на изображения

  • Автор Автор What
  • Начална дата Начална дата

What

Registered
Бих искал да сложа няколко изображения едно върху друго
то едното е прозрачно така че ще се получи един ефект който искам да постигна.
направих прост скрипт за да разбера как става това с наслагването, но нещо не успях дори и с <div>
ето го кода
Код:
<style>
img{
border: 0px;
width: 65px;
height: 65px;
}
</style>
<script>
function move()
{
 document.getElementById('id').innerHTML="<img src=peka.jpg>";
}
</script>
<div><div id="id"></div><img src="black.bmp"></div>

<br><input type="button" value="click" onclick="move()">
 
Направи по отделен <div> за всяка картинка, която ще наслагваш и във css-a напиши това долу за всяка картинка ;)

Код:
background: url(../img/pic.jpg);  // тук изображението 
position: absolute; 
left: 173px; // отляво колко да е отдръпнато
top: 0px; // отгоре колко да е отдръпнато
height: 189px; //точните размери на изображението
width: 658px;
 
2010ab03441ffdb4.png


Светлосиньото в фон,а черното е отгоре му.Ето css-a:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="bg" lang="bg">
<head>
<title>What?</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<meta name="Keywords" content="what" />
<meta name="Description" content="what" />
</head>
<body>
<div style="width:100px; height: 100px; background: url(BG2.png) no-repeat center; position: absolute; top:50%; left: 50%;"> </div>
<div style="width: 81px; height: 81px; background: url(bg.png) no-repeat center; position: absolute; top:52%; left: 51%; opacity: 0.3;"> </div>

<img src="BG2.png" alt="" />
<img src="bg.png" alt="" />
</body>
</html>

Теб ти трябва само това оцветеното.Ако искаш може да наслагваш повече картинки и да си регулираш коя да е отпред с z-index.Незнам дали ти върши работа,но аз с js немога да ти го направя.. :?:
 
ах пичове не ми трябва да е с точното положение на картинката
Те вече са зададени в една таблица изображенията само искам да сложа друга отгоре
 
ами на елемента в който са сложи position:relative;
<img class="pos" src="kakvoto e tam" alt="" />

.pos { position:absolute; left: колкото искаш; top:същото;}

и така си настройваш новия имг таг , който ще е над другите
 
Не може ли без да се поставя точно място на картинката
може би с някакъв индетификатор id или class...
 

Back
Горе