Skip to content

Instantly share code, notes, and snippets.

@yogbpl

yogbpl/background

Last active August 30, 2021 13:15
Show Gist options
  • Save yogbpl/5c120d318200b5b2ad93 to your computer and use it in GitHub Desktop.
Save yogbpl/5c120d318200b5b2ad93 to your computer and use it in GitHub Desktop.
Download ZIP
background image using data attribute
Raw
background
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
jQuery(document).ready(function(e) {
background();
});
function background()
{
var img=$('.image');
img.css('background-image', function () {
var bg = ('url(' + $(this).data('background') + ')');
return bg;
});
}
</script>
<style>
.image {
width: 250px;
height: 250px;
background-repeat: no-repeat;
background-position: center center;
background-size: 100%;
}
</style>
</head>
<body>
<div class="image" data-background="img/html5.png"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment