placeholder 1362
Fillerati - Faux Latin is a Dead Language
6 days ago by segfault
I made Fillerati because I grew tired of reading "Lorem ipsum..." on every new design I was working on. It's built with HTML5 and CSS2/CSS3, and consequently is best viewed in a modern browser such as Chrome, Firefox, Safari or Opera. Interactivity is thanks to the jQuery JavaScript library, served via the Google Ajax Libraries API. Custom fonts for the logo and author/title (Tangerine & IM Fell Great Primer respectively) are rendered with the Google Font API. Newly added is optional translation via the Google Language API (no promises on that one). Server side the app is coded in Python and deployed on Google App Engine. Domain management, email, etc. provided by Google Apps. The source for the public domain filler text is provided by Project Gutenburg (not sanitized—use at your own risk!). The background tile is from Tileables; getting stuff onto your clipboard from Zero Clipboard. Designed, built and deployed in 48 hours. If you have any questions, comments, or you'd like to suggest an author or title, you can reach me at michael@fillerati.com or via Twitter.
placeholder
text
loremipsum
generator
design
6 days ago by segfault
Placeholder images from flickr - flickholdr.com
8 days ago by jklina
Nice way to generate placeholders in wireframes
image
placeholder
layout
design
wireframe
8 days ago by jklina
HTML5 Placeholders for troublesome browsers (ie. IE9)
10 days ago by david.werbrouck
$(function() {
if(!$.support.placeholder) {
var active = document.activeElement;
$('textarea').each(function(index, element) {
if($(this).val().length == 0) {
$(this).html($(this).attr('id')).addClass('hasPlaceholder');
}
});
$('input, textarea').focus(function () {
if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
$(this).val('').removeClass('hasPlaceholder');
}
}).blur(function () {
if (($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder')))) {
$(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
//$(this).css('background', 'red');
}
});
$(':text').blur();
$(active).focus();
$('form').submit(function () {
$(this).find('.hasPlaceholder').each(function() { $(this).val(''); });
});
}
});
ie
placeholder
jquery
js
script
if(!$.support.placeholder) {
var active = document.activeElement;
$('textarea').each(function(index, element) {
if($(this).val().length == 0) {
$(this).html($(this).attr('id')).addClass('hasPlaceholder');
}
});
$('input, textarea').focus(function () {
if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
$(this).val('').removeClass('hasPlaceholder');
}
}).blur(function () {
if (($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder')))) {
$(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
//$(this).css('background', 'red');
}
});
$(':text').blur();
$(active).focus();
$('form').submit(function () {
$(this).find('.hasPlaceholder').each(function() { $(this).val(''); });
});
}
});
10 days ago by david.werbrouck
Copy this bookmark: