Web placehold.it adalah salah satu web yang memberikan jasa menampilkan image (gambar) dengan tampilan secara default (sederhana) Web lain dengan jasa serupa yakni placekitten dengan menampilkan gambar berupa kucing {CAT} Other web placeholder
Lantas buat apa Koben beberkan mereka semua? Gue berbicara tentang Create Your Own Placeholder! Placeholder yg akan dipakai ialah placehold.it & placekitten.com Ke dua web tersebut dikombinasikan agar tercipta random image display di dalam konten post. Seperti itu penjelasannya.
Trik membuat tampilan gambar pada area postingan dengan memakai 2 jasa web diatas, merupakan
Lantas buat apa Koben beberkan mereka semua? Gue berbicara tentang Create Your Own Placeholder! Placeholder yg akan dipakai ialah placehold.it & placekitten.com Ke dua web tersebut dikombinasikan agar tercipta random image display di dalam konten post. Seperti itu penjelasannya.
Trik membuat tampilan gambar pada area postingan dengan memakai 2 jasa web diatas, merupakan
trick jQuery pluginSyarat utama sudah tentu harus sudah terpasang script
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8 /jquery.min.js' type='text/javascript'></script>
DEMO(function ($)
{
$.fn.placekitten = function ()
{
this.find('img,a,div').each(function (i, element)
{
var w, h;
switch (element.nodeName)
{
case 'IMG':
w = element.width;
h = element.height;
if (w && h)
{
var src = 'http://placekitten.com/' + w + '/' + h;
element.src = src;
}
break;
case 'A':
case 'DIV':
var background = $(element).css("background-image");
if (background.indexOf('url(') > -1)
{
w = $(element).width();
h = $(element).height();
$(element).css("background-image", "url(http://placekitten.com/" + w + "/" + h + ")");
}
break;
}
});
};
})(jQuery);
$(function ()
{
$('body').placekitten();
});
Markup HTML<img src="http://placehold.it/100x200" />
<img src="http://placehold.it/200x200" />
<img src="http://placehold.it/250x200" />
<img src="http://placehold.it/255x200" />
<img src="http://placehold.it/300x200" />
Good luck :)Resource by: www.github.com
Loading... |
3 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/...