extended boundaries

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » extended boundaries » расширь границы » //////////////


//////////////

Сообщений 1 страница 2 из 2

1

/////////

0

2

Код:
<!--HTML-->
<div id="main-img">

<div class="coca-cola"></div><div class="hot-dog"></div><div class="pop-corn"></div><div class="aircraft"></div><div class="lily"></div>
	<div class = "status"></div>

</div>

<style>
#main-img {
background-image: url(https://i.imgur.com/Or7xiyo.jpg);
width: 750px;
height: 500px; 
background-size: 100%;
position: relative;
}

.coca-cola {
background-image: url(https://i.imgur.com/16FTjBQ.png);
width: 100px;
height: 100px; 
background-size: 100%;
background-repeat: no-repeat; 
position: absolute;
top: 260px;
left: 240px;
}

.hot-dog {
background-image: url(https://i.imgur.com/GZZvx58.png);
width: 50px;
height: 50px; 
background-size: 100%;
background-repeat: no-repeat; 
position: absolute;
top: 340px;
left: 420px;
}

.pop-corn {
background-image: url(https://i.imgur.com/PbEvavf.png);
width: 30px;
height: 40px; 
background-size: 100%;
background-repeat: no-repeat; 
position: absolute;
top: 270px;
left: 60px;
}

.aircraft {
background-image: url(https://i.imgur.com/xOTxRJU.png);
width: 60px;
height: 40px; 
background-size: 100%;
background-repeat: no-repeat; 
position: absolute;
top: 10px;
left: 270px;
}

.lily {
background-image: url(https://i.imgur.com/f8SXJZQ.png);
width: 40px;
height: 40px; 
background-size: 100%;
background-repeat: no-repeat; 
position: absolute;
top: 400px;
left: 270px;
}

.status {
font-size: 50px;
}
</style>

<script>
$('.coca-cola').click(function(){
  $('.coca-cola').hide('slow', function() {
  });
});

$('.hot-dog').click(function(){
  $('.hot-dog').hide('slow', function() {
  });
});

$('.pop-corn').click(function(){
  $('.pop-corn').hide('slow', function() {
  });
});

$('.aircraft').click(function(){
  $('.aircraft').hide('slow', function() {
  });
});

$('.lily').click(function(){
  $('.lily').hide('slow', function() {
  });
});
$(".status").text("Элементы появились");

</script>

0


Вы здесь » extended boundaries » расширь границы » //////////////


Рейтинг форумов | Создать форум бесплатно