winxp buton [css] ve form action seçimi

13.03.2005

kendi sitemde kullanmak üzere böyle birşeyler yaptım dün gece. winxp stilinde butonlar yapmak istedim ve bunu formu doldurandan aldığım bilgilere göre nası biribirnden farklı sayfalara gönderebilirim diye düşündüm ve sonunda bu çıktı orata. Vbulletin sağolsun bazı js kodlarını kendisinden aldım ama kızmaz herhalde

basit ve güzel oldu.

çalışan sayfa
download

CSS :

Kod:

.buttons {
	text-align: center;
	vertical-align: middle;
	height: 19px;
	width: 52px;
	background: url(buton7_ilk.gif) no-repeat scroll;
	display: block;
	font: 11px "trebuchet MS", Verdana, sans-serif;
	text-decoration: none;
	margin-bottom:2px;
	margin-left:-1px;
}
.buttons a {
	text-decoration: none;
	display: block;
	color:#444444;
	height: 19px;
	width: 52px;
	vertical-align:middle;
	line-height:17px;
}
.buttons a:hover {
	text-decoration: none;
	display: block;
	background: #8C9399 url(buton7_son.gif) no-repeat scroll;
	text-align: center;
	color:#000000;
	line-height:17px;
	height: 19px;
	width: 52px;
	vertical-align:middle;
}

JavaScript :

Kod:

var buldum_iste_burda = new Array();
var sunucu_tipi = '';
if (document.getElementById){
 sunucu_tipi = "std";
}else if (document.all){
 sunucu_tipi = "ie4";
}else if (document.layers){
 sunucu_tipi = "ns4";
}

function git_getir(arananID, forcefetch){
 if (forcefetch || typeof(buldum_iste_burda[arananID]) == "undefined"){
  switch (sunucu_tipi){
   case "std":{
    buldum_iste_burda[arananID] = document.getElementById(arananID);}
	break;
   case "ie4":{
    buldum_iste_burda[arananID] = document.all[arananID];}
    break;
   case "ns4":{
    buldum_iste_burda[arananID] = document.layers[arananID];}
	break;
  }
 }
return buldum_iste_burda[arananID];
}

function func_formgonder(){
 git_getir("gonder_form").action = git_getir("burayagonder").value;
 git_getir("gonder_form").submit();
 return true;
}

buton kullanımı :

Kod:

<a name="#formu-gonder"></a><div class="buttons"><a href="#formu-gonder" onclick="return func_formgonder();" title="formu gönder">gönder</a></div>

örnekteki formun kodlarını buraya koymuyorum üstteki adreslerden bilgisayarınıza indirebilirsiniz.