JQuery ile basit bir buton yapıyoruz. Örneğimizde kısa bir yazının, devamını görüntülemeyi kullandık. Bunun için div, p ve span taglarını kullandık… Span tıklandığında, click fonksiyonu çalışacak ve kısa yazımızın tamamı görüntülenecek, kapat butonu tıklandığında ise tekrar kısa ön yazıya dönülecek… 2 Adet içerik kullandım, birisi kısa ön yazı, diğeride devamına tıkladığımızda görüntüleyeceğimiz yazının tamamıdır. Butonlara [...]
JQUERY ve CSS ile basit açılır menü… Örneği Buradan İnceleyebilirsiniz.. İlgili sayfanın kaynak Kodlarına bakarak kodları kopyalayıp, html sayfası olarak kaydetmeniz yeterli olacaktır… Üst öğemizin arka plan resmi ise aşağıdaki gibidir. HTML sayfanızın yanına kopyalamanız yeterli olacaktır.. $(document).ready(function(){ $(“.icerik”).hide(); $(“h2.ustoge”).click(function(){ $(this).toggleClass(“active”).next().slideToggle(“fast”); }); }); H2, class ustoge olan tagımızın click olayına icerik tagımızın acılmasını sağladık.. slideToggle(“fast”) yerine slideToggle(“slow”) [...]
Ekstra uğraşa gerek kalmaksızın CSS ile açılır menü yapıyoruz. CSS Kodlarımız… #menü, arka plandaki div tagımız. Böylelikle arka planımız sayfayı boydan boya kaplarken, ekstra bir uğraşa girmeksizin menümüzü de ortalayabiliyoruz. .hmenu(horizontal(yatay) menü) ana menumuz oluyor, tabi içinde ise menü elemanlarimiz var. bu durumda menümüz ul ve li etiketlerinden oluşmaktadır. ul.hmenu ana menümüz ise onun içerisindeki diğer [...]
Bu yazımda CSS ile resimlerin otomatik boyutlandırmasına değineceğim. Varsayalım bir site tasarlıyoruz ve kullanıcıların eklediği resimlerin tasarım alanlarımızın dışına taşmasına engel olmak istiyor, engel olurken de resmin görünümünü bozmadan küçültmek istiyoruz. Ya da bizim dışımızda üyelerinde veri girdiği bir paylaşım sitemiz var ve böylesi bir sorunla karşı karşıyayız… Bu sorunu çözmek için, kod yazarak resmin [...]
