Itu demo bagaimana kita akan meng-fixed CSS3 rounded images with jQuery plug-in :-" Dengan sentuhan span tag sederhana membuat gambar kita akan bertambah GAYA :)) Nah mari kita eksplore, how to do it :">
Original posted :-bd.rounded {
display: inline-block;
border: solid 1px #000;
overflow: hidden;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .5);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .5);
box-shadow: 0 1px 3px rgba(0, 0, 0, .5);
}
Letakan kode CSS itu sebelum kode ]]></b:skin>
Jika sobat hanya memakai CSS tersebut maka hasil akan tampak...<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
$(document).ready(function(){
$(".rounded,").load(function() {
$(this).wrap(function(){
return '<span class="' + $(this).attr('class') + '" style="background:url(' + $(this).attr('src') + ') no-repeat center center; width: ' + $(this).width() + 'px; height: ' + $(this).height() + 'px;" />';
});
$(this).css("opacity","0");
});
});
</script><img src="http://link-gambar.gif" height="" width="" alt="" class="rounded" />
Hanya dengan meletakan atribut class="rounded" apabila kita akan membuat link pada gambar :)Webdesignerwall
See yah :-h
Loading... |
4 comments
DO NOT EVEN TRY ADD LINK [-X
You can use some HTML tags, such as
<b> - <i> - <a> - http://...jpg/gif/png/bmp - http://youtu.be/...