disabled option seçeneği ve i.e. karmaşası

aşağıdaki kodu hemen hemen çoğu çalışmamda kullanmışımdır. yani bir seçeneği etkisizleştirilmiş combobox denebilir.

<select> <option>abcde</option> <option disabled="'disabled'">abcde2</option> <option>abcde3</option></select>


genelde çalışamalarımı farklı browserlarda denerim hele ki i.e. de mutlaka denerim.
bi hata gariplik yapacağından emin olduğum için.

ama bu kadar bi garip olay olamaz. option için disabled özelliği i.e. de hiç çalışmıyomuş meğer.

şoku atlattıktan sonra birinin şu çözümünü gördüm (aynı konuya değinen siteler google link )

<!--[if lte IE 7]>
<script>
function ativaOptionsDisabled(){
var sels = document.getElementsByTagName('select');
for(var i=0; i < sels.length; i++){
sels[i].onchange= function(){ //pra se mudar pro desabilitado
if(this.options[this.selectedIndex].disabled){
if(this.options.length<=1){
this.selectedIndex = -1;
}else if(this.selectedIndex < this.options.length - 1){
this.selectedIndex++;
}else{
this.selectedIndex--;
}
}
}
if(sels[i].options[sels[i].selectedIndex].disabled){
//se o selecionado atual é desabilitado chamo o onchange
sels[i].onchange();
}
for(var j=0; j < sels[i].options.length; j++){ //colocando o estilo
if(sels[i].options[j].disabled){
sels[i].options[j].style.color = '#CCC';
}
}
}
}
window.attachEvent("onload", ativaOptionsDisabled)
</script>
<![endif]-->



(tabi fonksiyonu window.attachEvent yerine body içinde onload içinde yazabilirsiniz)

spry ile ikili koşul sağlama

xml verileriyle uğraşırken spry kullanmak aklıma geldi.
genelde o accordion şeysi için kullanırdım ama şimdi daha dinamik bi şekilde kullanayım dedim. (Dreamweaver ile çok daha kolay kullanılıyo, görsel bi şeysi sayesinde)
gerçekten çok işe yaradı.
1. bir adet spry dataset oluşturdum (gayet pratik)
2. ardıdan verileri şöyşe listeledim (sadece şuna sevindim iki kere ard arda spry:if kullanarak bi çeşit AND bağlacı yaptım.. ama OR yapması daha uzun olmakta bu mantıkla ... spry ile if için OR ya da AND bağlaçları için daha iyi bir yol varsa da bilmiyorum. üşendim aranmadım fazla. spry:if dökümanları içinde yoktu.)

<div spry:region="ds1" class="bildiri_liste">
<ul spry:repeatchildren="ds1">
<li>
<span spry:if="'{title}'.toUpperCase().indexOf(filtre.toUpperCase())!=-1">
<a href="#" spry:if="'{author}'.toUpperCase().indexOf(filtre2.toUpperCase())!=-1" onClick="updateTab('{file}');">
{title}
</a>

</span> </li>
</ul>
</div>

lightbox clones incelemesi

piayasada bir çok lightbox benzeri script mevcut. bunları bi kısmı yui, bi kısmı prototype ve daha başka kütüphaneler kullanmakta.
seçim yapmak zor oluyosa :) benim çok sevdiğim bir inceleme sayfası var.

http://planetozh.com/projects/lightbox-clones
bu sayfada çeşitli filtrelemelerle aradığınız lightbox türünü bulabilirsiniz.

yenilenen sayfa istemiyoruz

"küçük boyutlu içeriklerde yenilenen sayfalar istemiyoruz" desturuyla hareket etmek gerek.
bence (heleki içerik statikse) içeriği tek sayfa içinde bi elemana (div, span ya da iframe olabilir) yüklemek gerek. mutlaka gerek. her defasında tarayıcıyı yormaya gerek yok. yorulan sadece tarayıcı değil, sayfa yenilenmesi ile ekranda meydana gelen kıpırtı ile ziyaretçinin gözleri de yorulur ve hatta bu katarakta kadar gider (önemsiz bi not).
burda div elemanına yükledim.
linklerin onclik eylemine get_text fonksiyonumu koymak çok mantıklı gelmişti bana.
linklerin onclik eylemine get_text fonksiyonumu koymak çok mantıklı gelmişti bana.
.... href="#" onclick="get_text(15)".... gibi

function get_text(url){
var xmlHttp = null;
if (window.XMLHttpRequest){xmlHttp = new XMLHttpRequest();}

else if (window.ActiveXObject){xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }
else { }

xmlHttp.open('GET', url, false);
xmlHttp.send(null);
return xmlHttp.responseText;
}


function icerik(id){
var page=id+".php"; // bu dinamik olarak da oluşturulabilir
// mesela ->
// var page="get.php?content="+id;
var htm_icerik=get_text(page);
document.getElementById("divvvv").innerHTML =htm_icerik;
// document.getElementById("iframe1").src =page;
// eğer var olan sayfaları yüklemek isteseydim de bunu yapardım
}

yalınlık, fakat basitlik değil -1

bu bir yazı serisi olacak.

alt: yalın navigasyon istemiyoruz

Evet sitelerin bilhassa teperlinde çeşitli kategori ya da içeriğie yönlendirici ana bağlantılar vardır. navigasyon kısmı...
bu bağlantıların yalın halleriyle bırkıldığı siteler bazı durumlarda beni biraz soğutmuştur.
esasen temel üşengeçlik şu olsa gerek;
tepeye konacak (genelde bir "li" tagı içinde sırlanmış) menü elemanlarına şu stilin uygulanması:

#navigation{
height:2.2em;
line-height:2.2em;
width:758px;
margin:0 1px;
background:#578bb8;
color:#ffffff;
}

#navigation li{
float:left;
list-style-type:none;
border-right:1px solid #ffffff;
white-space:nowrap;
}

#navigation li a{
display:block;
padding:0 10px;
font-size:0.8em;
font-weight:normal;
text-transform:uppercase;
text-decoration:none;
background-color:inherit;
color: #ffffff;
}

böylesi daha iyi olurdu. hem daha belirgin hem abartı değil. tabi duruma göre değişir. sadece yalınlığı tercih eden webmaster kişilerine ufacık bi öneri olarak yeni nesil css mantığı üzerinde (aslında yeni değil) biraz çalışmaları yada zaten biliyorlarsa sevmeleri. Bilhassa yoğun program yazan kişiler bu konuya özen göstermeli sunacakları program ne kadar iyi olursa olsun karşıdaki insan şeysi sunum anında tasarımsal gözlemlerini ağırlıklı olarak tutuar.