jQuery on live
HTML
<div class="nice">
<div class="textnice">danny was a nice man</div>
</div>
<div class="shit">
<div class="textshit"></div>
CSS
body
{
background: yellow;
}
.nice
{
width: 140px;
height: 140px;
background-image: url(https://s3.amazonaws.com/photos.angel.co/users/47395-medium_jpg?1316385423);
margin: auto;
position: relative;
margin-top: 50px;
}
.textnice
{
width: 200px;
height: 100px;
left: -30px;
top: -30px;
position: absolute;
font-size: 22px;
color: black;
}
.shit
{
width: 190px;
height: 270px;
background-image: url(http://photos3.meetupstatic.com/photos/member/2/f/c/8/member_82452232.jpeg);
display: none;
margin: auto;
position: relative;
}
.textshit
{
width: 500px;
height: 100px;
left: -150px;
display: none;
font-size: 22px;
color: white;
position: absolute;
}
JavaScript
$(document).ready(function(){
$(".nice").hover(function(){
$("body").css("background", "black")
$(".nice").hide()
$(".textnice").hide()
$(".shit").fadeIn()
$(".textshit").fadeIn()
setInterval(function(){
$(".textshit").append(" <b> he is fucking idiöt nöw....... </b>");
}, 350);
});
});