Mühendisler Dünyası

Web sitesi tasarlarken özellikle modallar veya açılan pencere içinde ihtiyaçlardan bir tanesi de çarpı butonudur. Bu makalemizde çarpı işaretli butonun tasarımını anlatacağım. Genel tasarımı kullanarak sizde buna göre renkleri kendinize göre dizayn edebilirsiniz. Eğer projenizde bootstrap kullanıyorsanız burada close clasını da kullanacağız. Eğer bootstrap kullanmıyorsanız aşağıdakı close sınıfı kodlarını öncelikle css dosyanıza ekleyin.

Öncelikle konu başlığındaki Dinamik ID derken ne kastettiğimi anlatmak istiyorum. Bunun için bir örnek üzerinden konuyu açıklayarak konuya başlayacağım. Basit olabilmesi açısından elinizde bir tablo olduğunu düşünün. Bu tablodaki verileri tablodaki belirli bir özelliğe göre kategorize etmek istiyorsunuz. Kategorize ettikten sonra da örneğin Bootstrap Collapse kullanarak sadece tıklandığında göstermek istiyorsunuz. Sizin senaryolarınız da benzerlik içeriyorsa anlatacağım konu size faydalı olabilir. Bu işlemleri dinamik olarak yapabilmenin anahtar noktalarından bir tanesi de two-way binding destekli JavaScript Frameworklerinden birini kullanmaktan geçer.