Make image vertically centered align within a div and don’t let user save the picture easily

This is a very easy tutorial to set an image vertically centered within a div. Simple jQuery codes are used here. There is a also a nice option added that won’t let your user save the image easily. Please look at the code:

[html]

.resize{
width:105px;
height:100px;
background-position:center;
border:1px solid #000000;
margin:20px auto;
background-repeat:no-repeat;
}

$(document).ready(function() {
$(‘.resize’).each(function() {
var src = $(this).find(‘img’).attr(‘src’);
$(this).find(‘img’).attr(‘src’, ‘t.png’).css({‘width’:’100%’, ‘height’:’100%’});
$(this).css({‘backgroundImage’: ‘url(‘+src+’)’});
});
});

[/html]

Download Link

Leave a Reply

%d bloggers like this: