Hi…
Everyone have to search to display an image in thumbnail..because
its necessary to show in thumbnail. Otherwise image was shrink it’s not look
good…
When I am surfing I found very easy, simple code to show
image in thumbnail….so I share the code with my blog folks………
|
<html>
<head>
<style
type="text/css">
.thumbnail
{
vertical-align:middle;
}
</style>
<script type="text/javascript"
src="http://code.jquery.com/jquery-1.7.min.js"></script>
<script type="text/javascript">
function makethumb(src,FixedSize)
{var Width = $(src,this).width();
var Height = $(src,this).height();
var Ratio = Width / Height;
if (Width > FixedSize) {$(src,this).width(FixedSize)}
if (Height > FixedSize) {
var sizedwidth = FixedSize / Ratio;
var sizedheight = FixedSize / Ratio;
if (Height > Width) { if (Height > sizedwidth)
{$(src,this).height = FixedSize}
if (sizedwidth > FixedSize) {$(src,this).width($(src,this).width()
* Ratio);}
else {$(src,this).height($(src,this).height() * Ratio);}
}
else {$(src,this).width(FixedSize)}
}};
</script>
</head>
<body>
<img id="a1" class="thumbnail"
src="http://latimesblogs.latimes.com/photos/uncategorized/2008/10/05/love.jpg"
onload="makethumb(this,100)" />
<img id="a2" class="thumbnail"
src="http://images.google.com.my/intl/en_ALL/images/images_hp.gif"
onload="makethumb(this,100)"/>
</body>
</html>
|
i hope this one helpful to all........
0 comments:
Post a Comment