Fireworks ile Mavi Menü Tasarımı
Fireworks ile boş zamanımda yaptığım bir çalışma, aslında çalışmaya başladığım zaman tümüyle bir web sayfası yapayım demiştim ama menüden sonra kaldı. Aşağıdaki linkten indirebilirsiniz.
HTML5 Input Range
Bu konuda da HTML 5 ile gelen yeni input türlerinden olan range den bahsetmek istedim, RANGE kaydırma çubuğu kontrollü min ve max özellikleri ile tanımlanan aralıkta görsel olarak bir değer elde etmek için kullanılır.
Varsayılan Değerler
min : bu özellik aralığın en düşük değerini tanımlar.
max : bu özellik aralığın en yüksek değerini tanımlar.
step : tutmaç ileri veya geri çekildiği zaman min ve max arasındaki sayının kaçar kaçar artacağını veya eksileceğini tanımlar.
value : kısaca söylemek gerekirse " min + (max - min) / 2 "
Küçük bir ekran görüntüsünden sonra örneğimize başlayalım,
Şimdi de bir örnek;
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 RANGE</title>
<script type="text/javascript">
var init=function(){
change();
/* sayfa yüklendiğinde kaydırma çubuğunun
ürettiği değeri göstermek için change()
Fonksiyonunu çalıştıralım*/
}
var change=function(){//formchange olayında çalışacak fonksiyon
/*
form elemanının sakladığı değerde(ya da görsel
olarak üretilen değerde) değişiklik olursa formchange olayı oluşur.
*/
var elSlider=document.querySelector("input[type='range']");
var elResult=document.querySelector("input[type='range']+input");
elResult.value=elSlider.value;
}
</script>
</head>
<body onload="init();">
<form action="" name="form1">
<input type="range" name="rng" max="100" min="20" step="5" onformchange="change();" />
<input type="text" size="5"/>
</form>
</body>
HTML5 Placeholder Özelliği
HTML5 ile gelen yeni bir özellik te placeholder, bu özellik input alanlarında kullanıcıya bilgi - referans vermek için kullanılır, kısaca input içinde bir yer tutucu görevini yapar, kullanıcı inputa tıkladığında bu değer kaybolur ve boş bir input gözükür, ama google chrome da bu özelliği daha çok sevdim, kullanıcı inputa tıklasa bile içerik silinmiyor sadece veri girdiği zaman değişiyor, gelelim internet explorer a, aslında internet explorer a gelmek hiç istemiyorum hala ie9 bu özelliği desteklemiyor ve tabi alt sürümler de:)
Örneğimizi yapalım;
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>HTML5 PLACEHOLDER</title> </head> <body> <form id="form"> <p><input name="isim" type="text" placeholder="Adınızı Girin"/></p> <p><input name="soyisim" type="text" placeholder="Soyadınızı Girin"/></p> <p><input name="mail" type="text" placeholder="Mail Adresinizi Girin"/></p> </form> </body> </html>
Bir de chrome ve opera dan ekran görüntüsü ekleyelim;
gördüğünüz gibi bu kadar basit, input un name ve type ını belirledikten sonra placeholder değeri tanımladık hepsi bu, çalışan örneğini incelemek için buraya tıklayabilirsiniz.
Yandex Hata Sayfaları Vol 2
Rus arama motoru yandex te rastladığım yaratıcı hata sayfasını burada paylaşmıştım, ama adamlar bununla yetinmemiş ve yaratıcılıklarını konuşturarak daha farklı hata sayfaları yapmışlar işte size iki ekran görüntüsü :)
Hata sayfası 1
Hata sayfası 2
Google Input / Output İle Mükemmel Fizik Motoru
Google developers ekibi sonunda bunu da yaptı, HTML5 ve javascript ile yapılan uygulama ile kendi makinenizi tasarlayıp arkadaşlarınız ile paylaşabiliyorsunuz, üstelik tasarladığınız makine fizik kurallarına uygun. https://developers.google.com/events/io/ adresi üzerinden paylaşılan oyuncağa buradaki linkten ulaşabilirsiniz, şüphesiz ki google HTML5 konusunda çok iyi ve bu işe ciddi bir zaman ayırıyor, bunlarda uygulama ile geliştirilmiş birkaç makine videosu, iyi seyirler ve eğlenceler.
Google Plus
Arama
Ben
2004 Yılından bu yana yazılım teknolojileri üzerine çalışır, 2007 yılından itibaren Web teknolojilerine ağırlık vermektedir (PHP, ASP, CSS, JavaScript, JQuery, MySql, MsSql, xHtml, Html5), şu anda özel bir şirkette web yazılımcısıdır.
Sosyal Ben
