Rehber HTML, CSS ve JS ile sekmeli içerik yapımı

Peşpeşe tıklanınca bu şekilde kalmakta, ama güzel bir örnek.

Kayan sekme tam kaybolmadan birden yok oluyor.
Gelen sekme hiçbir efekt olmadan birden ortaya çıkıyor.

Ben sevmedim.

Trascendentium dedi:

Kayan sekme tam kaybolmadan birden yok oluyor.
Gelen sekme hiçbir efekt olmadan birden ortaya çıkıyor.

Ben sevmedim.

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

Efekt istiyorsanız çözümü basit, transition değeri verin.

Aslında amaç efekt değil olayın mantığını anlatmaktı. Efekti koyabilmek için temel bir kod örneği verdim sadece. Daha güzelini sizlerden bekleriz

ihydrogeni dedi:

Peşpeşe tıklanınca bu şekilde kalmakta, ama güzel bir örnek.

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

setTimeout kaynaklı bir sorun, düzelttim. Giriş seviyesinde efekti başka nasıl anlatacağımı bulamadım. Normalde bu iş için animate.css daha mantıklı olur.

Evilmonster dedi:

Efekt istiyorsanız çözümü basit, transition değeri verin.

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

transition display: none ve block için işe yaramaz. İstersen yine de deneyebilirsin, görmüş olursun.

Artık pek klasik JS yazan kalmadı, daha farklı JS dillerine yönelin. Örnek olarak VueJS verebilirim, en azından ben bunu kullanıyorum.

ihydrogeni dedi:

Artık pek klasik JS yazan kalmadı, daha farklı JS dillerine yönelin. Örnek olarak VueJS verebilirim, en azından ben bunu kullanıyorum.

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

VueJS biliyorum ama olayı anlatırken pure JS veya JQuery ile eski dilden anlatmak bana daha mantıklı geliyor. Bir şeyi öğrenirken her zaman temelden başlanmasını tavsiye ediyorum. Öbür türlü balıklama atlanıldığı zaman kalıcı olmuyor. Aslında bizim nesil bu işe başlarken avantajlıydık çünkü yeni frameworkler yoktu ve temelden öğrendik. Şu an öğrenenlerde bir kafa karışıklığı oluyor.