Kategori arşivi: css

Web sitem icin yeni 1 arayuz tasarimi

Selamlar,

WordPressin surekli gelistigi ve buyumeye devam ettigi acik 1 sekilde biliniyor. hali hazirda wordpress tabanli olan bu kisisel web sitemi kendi tasarim ve kodlamalarimla daha gorsel 1 hale getirmek istiyorum. bu yeni web sitemde calismalarim ve makalelerim yer alacak. aktif olan bu bolumu ise blog halinde 1 subdomaine entegre etmeyi dusunuyorum. yeni web sitesi ana basliklari su sekilde Web sitesi tasarimi seo Arama motoru optimizasyonu grafik calismalari css makaleleri ve 1 miktar cisco networking bilgileri.

bos zamanlarimda tasarlamaya devam ettigim arayuze bu linkten ulasabilirsiniz ayni zamanda yorum yaparak fikirlerinizi belirtebilirsiniz. zuzum a selam yok

css menuleri ve javascript dosyalari flash animasyonu uzerinde gostermek

Daha once tasarladigim 1 cok sitede karsilastigim flash uzerine gelen css menulerin yada javascript dosyalarin arka planda kalmasi ve cok kotu bir gorunumun ortaya cikmasi sorununun cozumunu rnmks arkadasin buldugu cozum ile bertaraf etmis durumdayiz.

asagidaki ornekte flash dosyasinin ust kismindaki div icerisinde bulunan spry menu linkleri onmouseover oldugunda asagi dogru aciliyor ancak 1 altta bulunan flash dosyasinin altinda kaliyor

bu durumda flash eklentisinin sayfa icerisindeki kodlama parametrelerine yeni 1 parametre ekliyoruz
<param name=”wmode” value=”transparent” />
yada flash eklentimizin properties ayarlarinda yeni parametreyi program yardimi ile ekliyoruz. sonuc goruntumuz asagida goruldugu sekilde ortaya cikiyor.

bu kodlamayi javascript dosyalarinda ve css menulerinde rahatlikla kullanabilirsiniz. bu kod w3 uyumlu oldugu icin w3 validasyonunda olumlu sonuc alabilirsiniz. Web seo

Xhtml uygun flash eklentisi kodlamasi.

googlenin xhtml uyumlu css ile kodlanmis web sayfalarina verdigi deger uzerine bircok firma web 2.0 stiline gecis yapmis ve css ile sitelerini kodlamaya baslamisti. Ancak karsimiza cikan en buyuk sorunlardan biri flash applikasyonlari web sitemize ekledigimizde sayfalarimizin xhtml dogrulamasindan olumsuz puanla donuyor olmasi idi. uzun arastirmalar sonunda bu sorununun cozumunu henuz tespit ettim ve kendi tasarladigim web sitelerinde deneyerek valid web 2.0 uyumlu css web sitelerine sahip olmanin mutlulugunu doyasiya yasadim 😉

uyguladigim kodlar XHTML 1.0 Strict (XHTML 1.1) ile uyumludur.

onject tagi ile uygulanan kodlar su sekilde
<object type=”application/x-shockwave-flash” data=”flash/banerdosyamizinismi.swf” width=”100″ height=”100″>
<param name=”movie” value=”flash/banerdosyamizinyolu.swf” />
</object>

embed kodu uygulamadan yaptigimiz bu calisma ile xhtml valid sonucu almamiz mumkun.
herkese css li gunler dilerim Zuzum. uygulamayi ilk olarak http://www.kalkan.org.tr sitesinde test ettim

CSS ile resim dosyasi kullanmadan yuvarlak koseler olusturma

web 2.0 ile butunlesen ve google’nin onem verdigi yeni nesil web sitelerinde yuvarlak koseler ( rounded corners ) kullanimi oldukca yaygin hale gelmistir.

ancak bircogumuzun yuvarlak kose olusturmakta zorlandigi kisim imaj ( jpg, gif ) dosyalarini sayfa arka plan rengine gore olusturup css ile div ler icerisine sag ust sol ust sag alt sol alt seklinde kodlar ekliyorduk. ancak kucuk bir javascript kodu ile bu durumu cozebilirsiniz. ayni zamanda koselerdeki derinlikleri rakam olarak buyuk yada kucuk olarak secebilme sansimizda mevcut.

calismamizin ornegini asagida gorebilirsiniz.

css rounded corners

sayfamizin kodlarinda gorunen
<script type=”text/javascript”>
Rounded(’rounded’, 13, 13);
</script>

script kodunu mutlaka icerikten sonra kapanis div tagindan once kullanmaliyiz. burada gorunen sayi (13) kosemizin derinligini gosteriyor. dilerseniz bu sayiyi daha yuksek yada kucuk bir rakamla degistirerek kosemizin derinligini duzenleyebiliriz.
Zuzum selamlar 😉

En kisa zamanda verileri ve resimleri yerlestiricem kusura bakmayin.

kaynak js dosyasini buradan indirebilirsiniz

butun dosyalari indirmek icin burayi tiklayin