Web sitenizde video yayınlayanlar genelde flash player ile yapılan video eklentileri veya Media Player kullanırlar. Fakat tüm bunlara gerek kalmadan sadece HTML5 ve CSS3 yardımı ile web sayfanızda video yayınlayabilirsiniz. HTML5′in yükselmesi ile gündeme gelen bu video oynatıcıları henüz Internet Explorer gibi bazı eski sürüm tarayıcılar desteklemese de oldukça popüler ve ilgi çekici oldukları söylenebilir.

Video JS, tamamen HTML5 ve CSS3 ile hazırlanan açık kaynak kodlu ve ücretsiz olarak dağıtılan bir video oynatıcısıdır. Web sitenizde videoları herhangi bir eklentiye gerek kalmadan yayınlamanızı sağlayan bu uygulama ile hertürlü videoyu yayınlayabilirsiniz. H264 ve Theora Ogg gibi formatları da destekleyen bu kolay kullanımlı uygulama kullanıcılar açısından herhangi bir sorun olmadan yayın yapabiliyor.

Tam ekran özelliği, ses ayarı, durdurma/oynatma düğmesi ve herhangi bir bölümüne sarabileceğiniz çubuğu ile diğer video oynatıcılarını aratmayan bu uygulamayı birçok tarayıcıda çalıştırabileceğiniz gibi iPhone veya iPad gibi dokunmatik cihazlarda da çalıştırabilirsiniz.

   İstediğiniz gibi ayarlayabileceğiniz gelişmiş özellikleri bulunan video oyanıcısı Video JS, InternetExplorer v7+, Firefox v3+, Google Chrome v4 ve Safari v4 destekliyor ayrıca iPhone/iPad gibi aletler üzerindende çalışabiliyor. 10.3 kb boyutundaki bu uygulamayı buradan indirebilir veya demosununda bulunduğu orjinal web sayfasını buradan kontrol edebilirsiniz.

Kanak: Bildirgeç

Popularity: 1% [?]

Çeşitli javascript kütüphaneleri kullanılarak hazırlanmış uygulamalara tek bir adres üzerinden ulaşabilirsiniz.

Hazırladığınız web sitelerinin tüm tarayıcılarda aynı şekilde çalışması, css ve xhtml doğrulamalarından geçmiş olması her web geliştiricisinin uyması gereken kuralların başında geliyor.

Bahsettiğimiz bu işlemleri gerçekleştirebilen, web sitenizde kullanabileceğiniz ve javascript kütüphaneleri ile hazırlanmış olan birçok uygulamaya ise cssaddons.com isimli servis ile ulaşabilirsiniz.

Kaynak: onlineservisler.com

Popularity: 2% [?]

http://www.free-css-templates.com/

http://www.freecsstemplates.org/

http://www.freecsstemplates.com

http://csscreme.com/freecsstemplates/

http://www.templateworld.com/free_templates.html

http://www.templateyes.com

http://www.templatemo.com/

http://www.opendesigns.org/view-designs/

http://css4free.com/

http://www.bestfreetemplates.info/

http://www.spyka.net/web-templates

http://www.os-templates.com/free-css-templates/1

http://www.csstemplatesfree.org

http://csstemplatesfree.net/

http://www.freelayouts.com

http://www.solucija.com/templates/free

http://www.my-free-css-templates.com

http://www.csstemps.info/

http://www.maxdesign.com.au/sites/

http://www.dreamtemplate.com

http://www.interspire.com/

http://www.freewebsitetemplates.com

Popularity: 3% [?]

Artık sizde Grafiti yapabilirsiniz

Sokaklarda gördüğünüz grafitiler sizinde ilginizi çekiyor mu? Peki hiç masrafsız, üstünüzün başınızın batma derdi olmadan ve bu konuya yetenekli olduğunuzu düşünmeden sizde grafitiler hazırlamak istemez misiniz?
Grafitileri hazırlamak için yalnızca fare kullanabiliyor olmanız yeter de artar bile. Yalnızca birkaç tıklama ile kendi grafitinizi hazırlayabilir ve kolayca çıktısını alabilirsiniz.

Servise ulaşmak için tıklayınız.

Resimlerinizi balonlarla konuşturun!

Çekmiş olduğunuz fotoğraflarını arkadaşlarınıza konuşma balonları ekleyerek göndermek istemisiniz?

Bunun için Superlame isimli İnternet sitesinin servisini kullanmanız yeterli.

Yükleyeceğiniz resimlerin üzerine çeşitli konuşma balonları oluşturarak resimlerinize renk katabilirsiniz. Yalnız unutmayın yüklediğiniz resimler 24 saat boyunca superlame sunucularında kalıyor, daha sonra otomatik olarak siliniyor. Bu yüzden işleminizi tamamladıktan sonra hazırladığınız resmi kendi bilgisayarınızda saklamanızda fayda var.

Bu kullanışlı servisin tek handikabı Türkçe karakter desteğinin olmaması.

Web siteleriniz için kolayca kutular hazırlayın!

Hiç bir grafik yazılımına ihtiyacınız olmandan, web siteniz için farklı stil ve renklerde kutular oluşturabilirsiniz.

Kolaylıkla web 2.0 grafikleri oluşturabileceğiniz FreshGeneratoruygulamasıyla, web siteniz için kutular hazırlamak artık oldukça kolay.

Box, Corners, Border ve Text’ten oluşan 4 ayarlama menüsü ile, hazırlayacağınız kutuların metin, kenarlık, kutu boyutları ve metin ayarlamalarını bu bölümler içerisinden yalnızca basit işlemlerle gerçekleştirebilirsiniz.

Web geliştiricilerin işini oldukça kolaylaştıracak bu servise buradan ulaşabilirsiniz.

Kolayca Web 2.0 Logoları oluşturun!

İnternet sitelerinde gördüğünüz ve Web 2.0 tarzı diye adlandırılan logolardan hiç bir grafik bilginiz olmasa da siz de hazırlayabilirsiniz.

Online servisler, hizmetleriyle hayatımızı kolaylaştırmaya devam ediyor. Özellikle web geliştirmeye meraklı olanlar için Web 2.0 Free Logo Generator isimli servis oldukça hoşlarına gidecek. Zira yalnızca saniyeler içerisinde, hiç bir grafik programına ihtiyaç duymadan Web 2.0 tarzı logolar hazırlayabilirsiniz.

Servise ulaşmak için tıklayın.

Fotoğraflarınızı eğlenceli hale getirin!

Yüz tanıma teknolojisi sayesinde birbirinden eğlenceli fotoğrafların içerisinde yer alabilir, arkadaşlarınızla paylaşabilirsiniz.

Fotofunia adresi eğlenceli bir online servis sağlıyor. Site içerisine yükleyeceğiniz fotoğraftaki yüzü tanıyarak, site içerisindeki onlarca fotoğraf teması içerisinden istediğinize bu yüzü yüklemenizi sağlıyor.

Hazırladığınız fotoğrafı herkesle paylaşabildiğiniz gibi yalnızca sizin tarafından görüntülenmesini de seçebiliyor, aynı zamanda bu resmin MSN avatarı halini de indirebiliyorsunuz.

Siteye ulaşmak için tıklayın.

En eğlenceli fotoğraf editörü; piZap

Fotoğraflarınızın üzerinde çeşitli araçlarla yapabileceğiniz ekleme ve oynamalarla bir birinden komik fotoğraflar oluşturabilirsiniz.

Üyelik gerektirmeden tüm ziyaretçilerine fotoğraf düzenleme şansı veren piZap ile fotoğraflarınıza konuşma balonu, çeşitli görsel yazılar, stickerlar, yüz şekilleri, efektler, smile ifadeleri ve çok daha fazlasını piZap ile ekleyebilirsiniz.

Hazırlamış olduğunuz fotoğrafları site üzerinden yayınlayabildiğiniz gibi, özel link oluşturarak yalnızca istediklerinizle de paylaşabilirsiniz.

Yansımalı yazılar hazırlayalım

Pek çok web sitesinde görmeye alıştığımız yansımalı yazıları hiçbir grafik yazılımı kullanmayı bilmeden hazırlamak ister misiniz?

Reflection Maker ile yansımalı yazılar hazırlamak artık çok kolay. Bunun için yansıması yapılacak olan resmin URL adresini girmeniz veya site üzerine yükleyerek bu işlemi kolayca yapabilirsiniz.

Servise ulaşmak için tıklayınız.

Bu rozetlerin hepsi sizin için!

Web 2.0 tarzı sitelerde sıklıkla görmeye alışık olduğumuz beta rozetlerinden tasarımı size ait olmak üzere dilediğiniz kadar hazırlayabilirsiniz.

Birbirinden güzel tasarım şekilleri ile hazırlanmış ve sizlerin belirleyeceği metin, renk ve yazı tipine göre web sitenizde kullanabileceğiniz rozetleri web20badges.com adresinden hazırlayabilirsiniz.

Servise ulaşmak için tıklayınız.

Ücretsiz PNG ikonlar

Web siteniz için ikonlar arıyorsanız bir birinden kaliteli PNG ikonlar sizi bekliyor. Üstelik ücretsiz!

Web sitesi tasarımlarınızda kullanabileceğiniz ve oldukça geniş bir arşive sahip olan Pngicon.com adresi, ikonlar arasında kaybolmamanız için arama hizmetini de sunuyor.

Tarayıcı simgelerinden, sosyal imleme ikonlarına, oyun karakterlerinden rss ikonlarına kadar pek çok farklı türden kaliteli PNG ikonlarına ihtiyaç duyduğunuzda, kullanabileceğiniz oldukça faydalı bir online servis.

Sekme hazırlamak hiç bu kadar kolay olmamıştı!

Web sitesi geliştiricilerinin oldukça işine yarayacak bu servisle, işlerinizi daha da kolaylaştırın.

Hiç bir teknik bilgiye ihtiyacınız olmaksızın Tabs Generator‘ın kullanışlı sihirbazı sayesinde kolayca tab/sekme menüleri hazırlayabilirsiniz.

Yapmak istediğiniz sekmelerin yükseklik, genişlik, kenar kalınlığı, köşe yapısı, renk ayarlamaları gibi seçenekleri isteğinize göre belirleyerek yalnızca bir kaç adımda sekmeleriniz hazır!

Popularity: 3% [?]

Cascading Style Sheets (Türkçede Stil şablonları) yani bilinen kısa adıyla CSS, HTML’e ek olarak metin ve format biçimlendirme alanında fazladan olanaklar sunan bir web teknolojisidir.

LİNK ÖZELLİKLERİ

a :Linkin, sayfa açıldığında tıklanmadan veya ümleç üzerine getirilmeden önceki durumudur.
a:hover :Linkin imleç üzerine getirildiğindeki durumudur.
a:active :Linkin tıklandığı andaki durumudur.
a:visited :Linkin tıklandıktan sonraki durumudur.

BİÇİMLENDİRME:

color:Linkin rengini belirler.
background-color:Linkin zemin rengini belirler.
background-image:Linkin zeminine resim ekler(Bu animated-gif de olabilir.)
text-decoration:Linkin altının,üstünün vs. çizgili olup olmayacağını belirler.
font-weight:Yazının kalınlık veya inceliğini belirler.
border:Linkin etrafına kenarlık ekler.
display:Linki içeren hücre , satır vb. istenilen alanın seçilmesini sağlar.

LİSTE ÖZELLİKLERİ

disk:Liste biçiminin disk (içi dolu daire) şeklinde olmasını sağlar.
circle : Liste biçiminin çember şeklinde olmasını sağlar.
square : Liste biçiminin kare olmasını sağlar.
decimal : Liste biçiminin rakamlardan oluşmasını sağlar.
lower-roman : Liste biçiminin i,ii,iii gibi küçük roma rakamlarından oluşmasını sağlar.
upper-roman : Liste biçiminin I,II,II gibi büyük roma rakamlarından oluşmasını sağlar.
lower-alpha : Liste biçiminin a,b,c şeklinde küçük harf olmasını sağlar.
upper-alpha : Liste biçiminin A,B,C şeklinde büyük harf olmasını sağlar.
none : Listenin simgesiz olmasını sağlar.
inside : Listenin ikinci satırının en soldan başlamasını sağlar.
Outside : Listenin ikinci satırının ilk satır ile aynı yerden başlamasını sağlar.
list-style-image : Liste biçiminin resim olmasını sağlar.

KATMAN ÖZELLİKLERİ

position:Katmanın yerinin belirlenmesini sağlar.
absolute:Katmanın yerinin pencere esas alınarak belirlenmesini sağlar.
relative: Katmanın yerinin bir önceki katman esas alınarak belirlenmesini sağlar.
static:Katmanın yerinin sabit olarak (Varsayılan olan sol üst köşe) belirlenmesini sağlar.
top:Katmanın üstten ne kadar aşağıda olması gerektiğini belirler.
left:Katmanın soldan ne kadar içeride olması gerektiğini belirler.
width:Katmanın genişliğinin ne kadar olacağını belirler.
height:Katmanın yüksekliğinin ne kadar olacağını belirler.
overflow:Katmanın belirtilen yükseklik ve genişliğe sığmayan kısmına ne olacağını belirler.
auto:Otomatik olarak belirlenir.
scroll:Kaydırma çubuğu ekleyerek görünmesini sağlar.
visible : Katmanı belirtilen boyutların dışına taşırarak sığmayan yerlerin görünmesini sağlar.
hidden:Sığmayan yerleri gizler.
visibility:Katmanın görünebilirlik ayarını yapar.
visible : Katmanın görünür olmasını sağlar.
hidden:Katmanı gizler.
z-index : Katmanların alttan üste doğru hangi sıra ile gösterileceğini belirler.1 değeri katmanın en altta olacağını belirtir.

FONT ÖZELLİKLERİ

font-family:Yazı türünü belirler.(Arial , Verdana gibi.)
font-style:Yazının normal veya sağa eğik olmasını sağlar.
font-variant:Yazının normal veya tümünün büyük harflerden oluşmuş olmasını sağlar.
font-weight:Yazının kalınlık-inceliğini belirler.
font-size:Yazının büyüklüğünü belirler.

TEXT ÖZELLİKLERİ

word-spacing : Kelimeler arasında bırakılacak boşluğu boşluğu belirler.
letter-spacing : Harfler arasında bırakılacak boşluğu boşluğu belirler.
text-decoration : Kelimenin altının , üstünün vs. çizili olup olmayacağını belirler.
underline : Kelimenin altının (Satır altından) çizili olmasını sağlar.
overline : Kelimenin üstünün (Satır üstünden) çizili olmasını sağlar.
line-through : Kelimenin ortasından çizili olmasını sağlar.
blink : Kelimenin yanıp sönmesini sağlar.(Netscape için)
vertical-align : Metnin yatay olarak nasıl hizalanacağını belirler.
text-transform: Kelimelerin büyük harf veya küçük harflerden oluşmasını sağlar.
capitalize : Kelimelerin ilk harflerinin büyük olmasını sağlar.
uppercase : Kelimelerin bütün harflerinin büyük olmasını sağlar.
lowercase : Kelimelerin bütün harflerinin küçük olmasını sağlar.
none : Kelimelerin orjinal metindeki gibi olmasını sağlar.
text-align: Metnin dikey olarak nasıl hizalanacağını belirler.
left : Metni sola yaslar.
right : Metni sağa yaslar.
center : Metni ortalar.
justify : Metni iki yana yaslar.
text-indent : Metnin ilk satırının soldan ne kadar içerden başlayacağını belirler.
line-height : Satırın yüksekliğini ayarlar.(Yüksek değer verildiğinde satırlar arasındaki boşluk artar.)
first-line : Metnin ilk satırının biçimlendirilmesini sağlar.
first-letter : Metnin ilk harfinin biçimlendirilmesini sağlar.

İMLEÇ ÖZELLİKLERİ

crosshair:İmlecin artı işareti şeklinde olmasını sağlar.
auto:İmlecin metinde dikey çizgi ,boş alanda normal ok şeklinde olmasını sağlar.
default:İmlecin hem metinde hem de boş alanda normal ok şeklinde olmasını sağlar.
hand:İmlecin linkte olduğu gibi el şeklinde olmasını sağlar.
move:İmlecin taşıma işareti şeklinde olmasını sağlar.
ne-resize:İmlecin sağa yatık normal ok olmasını sağlar.
nw-resize:İmlecin sola yatık normal ok olmasını sağlar.
se-resize:İmlecin yukardan aşağı doğru ve sağa yatık normal ok olmasını sağlar.
sw-resize:İmlecin yukardan aşağı doğru ve sola yatık normal ok olmasını sağlar.
n-resize:İmlecin aşağıdan yukarıya doğru ince ok şeklinde olmasını sağlar.
s-resize:İmlecin yukardan aşağı doğru ince ok şeklinde olmasını sağlar.
w-resize:İmlecin sola doğru ince ok şeklinde olmasını sağlar.
e-resize:İmlecin sağa doğru ince ok şeklinde olmasını sağlar.
text:İmlecin hem metinde hem de boş alanda metinde olduğu gibi görünmesini sağlar.
wait:İmlecin meşgul animasyonuna dönüşmesini sağlar.
help:İmlecin yardım-soru işaretine dönüşmesini sağlar

ZEMİN ÖZELLİKLERİ

background-color: Zeminin rengini belirler.
#color : Renk adı.
transparent: Zeminin saydam olmasını sağlar.
background-image: Zemine resim yerleştirilmesini sağlar.
url : Zemine yerleştirilen resmin adresi.
background-repeat: Zemine yerleştirilen resmin nasıl yayılacağını belirler.
repeat : Resmin bütün zemine yayılmasını sağlar.
repeat-x : Resmin sol-üstten sağ-üste doğru yayılmasını sağlar.
repeat-y : Resmin sol-üstten sol-alta doğru yayılmasını sağlar.
no-repeat: Resmin yayılmadan orjinal boyutuyla görünmesini sağlar.
background-attachment: Zemindeki resmin , sayfa kaydırma çubuğuyla hareket ettirildiğindeki durumunu belirler.
scroll : Sayfa hareket ettirildiğinde zeminin de kaymasını sağlar.
fixed: Sayfa kaydırılsa da zeminin sabit kalmasını sağlar
background-position: Zemindeki resmin istenilen şekilde yerleştirilmesini sağlar.
top : Resmi yukarı yerleştirir.
center : Resmi ortalar.
bottom : Resmi aşağı yerleştirir.
left : Resmi sola yerleştirir.
right: Resmi sağa yerleştirir.
…px : Resmin soldan istenilen ölçüde içerde olmasını sağlar.

TABLO ÖZELLİKLERİ

margin : Tablo ile pencerenin kenarları arasında bırakılacak boşluğu belirler.
margin-top : Tablo ile pencerenin üst kenarı arasında bırakılacak boşluğu belirler.
margin-right : Tablo ile pencerenin sağ kenarı arasında bırakılacak boşluğu belirler.
margin-bottom : Tablo ile pencerenin alt kenarı arasında bırakılacak boşluğu belirler.
margin-left : Tablo ile pencerenin sol kenarı arasında bırakılacak boşluğu belirler.

padding : Tablo kenarları ile tablo içeriği (Yazı vb.) arasında bırakılacak boşluğu belirler.
padding-top : Tablonun üst kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler.
padding-right : Tablonun sağ kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler.
padding-bottom : Tablonun alt kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler.
padding-left : Tablonun sol kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler.

border : Tablonun kenarlarının şekillendirilmesini sağlar.

border-top : Tablonun üst kenarının şekillendirilmesini sağlar.
border-left : Tablonun sol kenarının şekillendirilmesini sağlar.
border-bottom : Tablonun alt kenarının şekillendirilmesini sağlar.
border-right : Tablonun sağ kenarının şekillendirilmesini sağlar.

border-width : Tablonun kenarlarının kalınlığını belirler.
border-top-width : Tablonun üst kenarının kalınlığını belirler.
border-right-width : Tablonun sağ kenarının kalınlığını belirler.
border-bottom-width : Tablonun alt kenarının kalınlığını belirler.
border-left-width : Tablonun sol kenarının kalınlığını belirler.

border-style : Tablonun kenarlık türünü belirler.
border-top-style : Tablonun üst kenarlık türünü belirler.
border-right-style : Tablonun sağ kenarlık türünü belirler.
border-bottom-style : Tablonun alt kenarlık türünü belirler.
border-left-style : Tablonun sol kenarlık türünü belirler.

border-color : Tablonun kenarlarının rengini belirler.
border-top-color : Tablonun üst kenarının rengini belirler.
border-right-color : Tablonun sağ kenarının rengini belirler.
border-bottom-color : Tablonun alt kenarının rengini belirler.
border-left-color : Tablonun sol kenarının rengini belirler.
color : Tabloda geçen metnin rengini belirler.
width : Tablonon genişliğini belirler.
height : Tablonun yüksekliğini belirler.

NOT : Başlık “TABLO” olarak verildi Ancak bu nitelikler başta TD , TR , TH vs. olmak üzere hemen her etiket için kullanılabilir.CSS’ yi özel kılan da zaten bu…

KAYDIRMA ÇUBUĞU ÖZELLİKLERİ

scrollbar-face-color :Kaydırma çubuğunun yüzey rengi , aynı zamanda zemini de etkiliyor.
scrollbar-base-color :Kaydırma çubuğununun sol ve üst kenarlıklarını çizgi halinde kaplıyor.
scrollbar-shadow-color :Sağ ve alt kenarlıkların gölge rengi.
scrollbar-highlight-color :Sol ve üst kenarlıkların gölge rengi,aynı zamanda zemini de etkiliyor.
scrollbar-arrow-color :Yön oklarının rengi

Popularity: 2% [?]

Sitenize diğer basit menülerden öte açılıp kapanan aşağı ve sağa/sola doğru kayan, arka plan rengi değiştirilebilen hoş menüler koymak mümkün. Ayrıca bunları yaparken flash bilginizin olması da gerekmiyor. Çünkü harika bir şey olan jquery sayesinde tüm bunları yapabiliyoruz.

Horizontal scrolling menu | demo - ders

Yatay olarak sağa-sola kayan hoş bir navigasyon menüsü

Fading menu – replacing content | demo - ders

Tıkladığınızda, tıkladığınız sayfanın linkini koyulaştıran bir uygulama.

Background image animations | demo - ders

Arka planın farklı biçimlerde rengini değiştiren navigasyon menü.

Animated menus using jquery | demo - ders

Arka plan değiştiren farklı bir navigasyon menüsü.

Apple style menu | demo - ders

Benzerlerini birçok yerde görebileceğiniz sağa kayan ve arka plan resmi çıkan farklı bir navigasyon menüsü.

Cool animated navigation with jquery | demo - ders

Gördüğünüzde flash ile yapıldığını sanabileceğiniz çok hoş bir uygulama.

Css sprites 2 | demo - ders

Farklı biçimde arka planı değiştiren ek olarak css ağırlıklı yapılmış navigasyon menü.

Sexy drop down menu | demo - ders

(Jquery ve css ile hazırlanmış düşey olarak hareket eden menü uygulaması)

Vimeo-like top navigation | demo - ders

Vimeo.com sitesindeki menünün aynısı. Çok kullanışlı bir uygulama.

Outlook navigation bar | ders

Outlook menüsünün aynısını jquery ile yapmışlar.

Kaynak : bildirgec.org

Popularity: 1% [?]

Jquery günümüzde oldukça popüler ve genişlemiş bir kütüphane. Css3 ise yeni bir dil olmasına rağmen oldukça kullanışlı ve görsel olarak muhteşem. Bu ikisi birleşince ortaya çok güzel çalışmalar çıkabiliyor. Fakat css3 çalışmaları tam olarak tamamlanmadığından tarayıcıların daha alt sürümlerinde çalışmayabilir. Aşağıdaki uygulamaları web sitenize ekleyebileceğiniz gibi uygulamalar ilham kaynağınız olup kendiniz farklı çalışmalar yapabilirsiniz;

polaroid photo viewer with css3 and jquery | demo

Polaroid photo viewer, css3 ve jquery ile yapılmış farklı bir uygulamadır. Farklı birçok resmi ekranda yayar ve mouse ile taşınmasını sağlar.

sweet ajax tabs with jquery 1.4 | demo

Sweet ajax tabs, css3 ve jquery ile hazırlanmış bir tab uygulamasıdır. Bu uygulama sayesinde web sayfanızda yeni sayfa yüklemesine gerek kalmadan diğer sayfalar arası geçişi sağlayabilirisiniz. bu sayede ziyaretçileriz daha az bağlanma sorunu yaşamış olurlar.

Jslickmenu: a jquery plugin for slick css3 menus | demo

Jslickmenu‘yü diğerler menü uygulamalarından ayıran özelliği fotoğraflar ile hazırlanmış olması ve fotoğrafların üzerine mouse ile gelindiğinde bilgi metni belirmesidir. Dilerseniz resimleri y ekseni etrafında döndürebilirsiniz.

Jquery css3 lightbox gallery script - demo

Polaroid photo viewer benzeri bu uygulama resimleri sayfanızda taşımanızı sağlıyor. Ek özelliği ise resimleri herhangi bir blok ya da kutuya taşıdığınızda resim üzerinden dilerseniz işlem yapabilmeniz.

Windows aero using css3 and jquery | demo

Bu uygulama ile web sitenizde pencereler yaratabilir ve ziyaretçileriniz bu pencereleri herhangi bir yere taşımasını sağlayabilirsiniz. Css3 ile hazırlanan bu uygulama windows aero teması ile hazırlanmış.firefox 3.6 ve altı sürümlerde çalışmıyor.

İmages gallery using css3 and jquery | demo

Popularity: -0% [?]

Oluşturduğunuz web sitelerinin istatistiklerini google analytics haricinde tutabileceğiniz alternatif araçlarda mevcuttur. bunlardan birkaçını aşağıda bulabilirsiniz.

Get Clicky

Mint

FireStats

eLogic

ClickFox

Popularity: -0% [?]

Google’ın arama motorunu kullanarak sadece kendi sitemizde arama yapan bir arama motoru hazırlayabilirsiniz.

Sitenize Google Custom Search’ın (GCS) kurmak ve bunu tamamen kendi sunucunuzda çalışıyor gibi göstermek için yapmanız gerekenler şu şekilde:

1. google.com/coop/cse/ adresine giderek Create a Custom Search Engine tuşuna basın.
2. 1. adımda arama motorunun adını, tanımını, dilini ve arama yapılmasını istediğiniz web adreslerini girin.
3. 2. adımda test görünümünü elde edeceksiniz.
4. Bu adımlardan sonra dilerseniz size verilen kodu arama fonksiyonunuzun olacağı yere koyarak direkt çalışmasını sağlayabilirsiniz.
5. Eğer kendi sayfa görünümünüzde verilmesini istiyorsanız My Search Engines altındaki ayarlara göz atmanız gerekecek. Control Panel’e tıklayarak ayarlarınıza geçin.
6. Basics altında temel ayarlarınızı bulacaksınız. Eğer kişisel veya gelir elde etmeyen bir kullanımınız varsa arama sonuçlarından reklamları kaldırabilirsiniz. Eğer Google Adsense kullanıyorsanız kendi reklamlarınızı da yerleştirip, gelir elde edebilirsiniz.
7. Look and Feel sayfasında arama kutunuzun nasıl görüneceğini seçebilirsiniz. Sayfanın altlarına doğru ise arama sonuçlarındaki renkleri sitenizin renklerine göre değiştirebilirsiniz.
8. Code kısmı önemli bir sayfa. Eğer başta dediğim gibi GCS arama sonuçlarının siteniz altında görünmesini istiyorsanız 2 seçeneğiniz var. Birincisi sunucunuzda bir sayfa yaratabileceğiniz iframe seçeneği, diğeri ise yeni bir seçenek olan overlay seçeneği. Benim tavsiyem, iframe olacaktır. Zira overlay seçeneği JavaScript ve AJAX kullandığı için pek de kullanışlı değil. iframe’i seçtikten sonra adres kısmına arama sonuçlarının yayınlanacağı sayfayı yazmanız gerekiyor. http://www.pcbilkent.net/arama.php gibi. Bunu yazdıktan sonra aşağıdaki 2 kod bloğu değişecek. İlk kutudaki kodu, arama kutunuzun olmasını istediğiniz yere yerleştirmelisiniz. 2. kodu ise arama sonuçlarının çıkacağı arama.php dosyasına yerleştirmelisiniz. Arama.php dosyası sizin sitenizin tasarımında olabilir. Kodu içerik alanına yerleştirebilirsiniz.
9. Eğer arama sonuçlarındaki reklamlardan gelir elde etmek istiyorsanız, Make Money’e tıklayarak Google Adsense hesabınız ile bağlamalısınız. Google Adsense hesabınıza girip, erişime izin vermeniz gerekecek.

Popularity: 1% [?]

Tasarımı çok şık olan bu saatleri ClockLink adresinde bulabilirsiniz.Saatin üstüne şehir ismi yazabilirsiniz veya saat dilimini ayarlayabilirsiniz. Sadece html kodu alıp blogunuzda veya sitenizde istediğiniz yere yerleştiriyorsunuz.

Popularity: unranked [?]