Butona Basıldığında Bir Çeşit Form Çıkmasını Sağlama

Shane Gill dedi:

Acma butonu ve kapatma butonu. Id vererek su sekilde halledersin.

JavaScript:Panoya kopyala

var button = document.getElementById("form-acma-button");
var close = document.getElementById("close-form");
var form = document.getElementById("form-id");

button.oncklick = function(){
    form.style.display = "block";
}

close.onclick = function(){
    form.style.display = "none";
}

Ha bide o form acilirken animasyonlu gelsin istiyorsan

CSS:Panoya kopyala

transition: 0.5 ease;

eklersin css e.
Takildigin bi yer olursa yazarsin yardim etmeye calisirim.
Eklemeyi unutmusum. Bunu position: fixed yaparsan istedigin konuma koyarsin. Kullanici asagi yukari scroll etse bile yeri degismez.

Genişletmek için tıkla...

Ömer Erten dedi:

Teşekkür ederim. Peki formu nasıl oluşturabilirim ? Html dosyasında oluştursam olur mu ?

Genişletmek için tıkla...

HTML Forms

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

codelab dedi:

tavsiyem oluşturacağın formun modal şeklinde olması yani ekranı komple kaplaması ve bi köşeye felan kapat butonu eklemen.formum sağ altta sabit kalsın diyorsun bunun için css özelliğinde
position:fixed olması gerekiyor.



form olayı çok basit zaten :

HTML:Panoya kopyala

<form id="form1" action="yonleneceksayfa" method="post veya get">



<input type="text" name="ad" placeholder="adınızı giriniz"></input>



</form>

bir tavsiyem de şu olsun size uyarmı uymazmı bilemem bir elementin sınıfını yani class ismini de Javascript kullanarak değiştirebilirsiniz.bir formun iki tür sınıfı olmuş olur.

CSS:Panoya kopyala

.form1{display:none}

.form2{display:block}

Genişletmek için tıkla...