Skip to content

Instantly share code, notes, and snippets.

@geocodinglife
Created March 24, 2017 17:44
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save geocodinglife/9af95898349428b5f612ee83589f76d5 to your computer and use it in GitHub Desktop.
Save geocodinglife/9af95898349428b5f612ee83589f76d5 to your computer and use it in GitHub Desktop.
.tiny-stone{
width: 45px;
height: 45px;
position: relative;
margin: auto;
background: image-url('green-ubatuba.jpg');
background-size: cover;
}
.tiny-wall-top{
width: 100%;
height: 10px;
left: 0px;
top: -15px;
position: absolute;
background: red;
background: image-url('green-ubatuba.jpg');
background-size: cover;
}
.tiny-wall-right,
.tiny-wall-left{
width: 10px;
height: 45px;
top: 0px;
position: absolute;
background: red;
background: image-url('green-ubatuba.jpg');
background-size: cover;
}
$('.sink-stone').click(function(){
var stone = $(this).attr('data-granite');
$('#sink-stone').css('background-image', 'url("assets/'+stone+'")');
$('#wall-top').css('background-image', 'url("assets/'+stone+'")');
$('#wall-left').css('background-image', 'url("assets/'+stone+'")');
$('#wall-right').css('background-image', 'url("assets/'+stone+'")');
$('.tiny-stone').css('background-image', 'url("assets/'+stone+'")');
$('.tiny-wall-top').css('background-image', 'url("assets/'+stone+'")');
$('.tiny-wall-left').css('background-image', 'url("assets/'+stone+'")');
$('.tiny-wall-right').css('background-image', 'url("assets/'+stone+'")');
$('#tiny-sink-container-1').css('background-image', 'url("assets/'+stone+'")');
$('#tiny-sink-container-2').css('background-image', 'url("assets/'+stone+'")');
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment