wmaraci reklam

jquery kodlarında ufak bir değişiklik

5 Mesajlar 1.126 Okunma
wmaraci reklam

ErcanDinsel ErcanDinsel E' Kullanıcı
  • Üyelik 28.01.2012
  • Yaş/Cinsiyet 32 / E
  • Meslek Grafiker. / ercandinsel.org
  • Konum Kocaeli
  • Ad Soyad E** D**
  • Mesajlar 670
  • Beğeniler 54 / 241
  • Ticaret 1, (%100)
https://coolestguidesontheplanet.com/creating-expandable-faq-page-using-jquery/ Bu sayfadaki faq tasarımını kullanıyorum style olarak kendim özelleştirdim ancak jquery içinde ufak bir düzenlemek istiyorum. Sayfaki tasarımda konuya tıklayınca cevabı açılıyor, bir diğerine tıklarsan diğeri açılıyor, benim istediğim şey sadece 1 tanesi açık olsun yani bir başlığa tıklayınca açılacak ancak başka bir başlığa tıklanırsa önceki başlık kapanacak.
 

 

SMM Panel, Sosyalyuvam, Bayilik Paneli, En Uygun Panel, Takipçi Paneli
reklam

KadirCeyhan KadirCeyhan WM Aracı Kullanıcı
  • Üyelik 23.10.2016
  • Yaş/Cinsiyet 26 / E
  • Meslek Öğrenci
  • Konum Denizli
  • Ad Soyad K** C**
  • Mesajlar 691
  • Beğeniler 0 / 203
  • Ticaret 6, (%100)
Kendi sitenin linkini verirmisin. Console üzerinde deneyeyim.
 

 

ErcanDinsel ErcanDinsel E' Kullanıcı
  • Üyelik 28.01.2012
  • Yaş/Cinsiyet 32 / E
  • Meslek Grafiker. / ercandinsel.org
  • Konum Kocaeli
  • Ad Soyad E** D**
  • Mesajlar 670
  • Beğeniler 54 / 241
  • Ticaret 1, (%100)

Jelioxe adlı üyeden alıntı

Kendi sitenin linkini verirmisin. Console üzerinde deneyeyim.


localhost üzerinde çalışıyorum hocam şuan herhangi sunucuya yüklemedim
 

 

qdval qdval WM Aracı Kullanıcı
  • Üyelik 21.05.2016
  • Yaş/Cinsiyet 33 / E
  • Meslek -
  • Konum Zonguldak
  • Ad Soyad E** E**
  • Mesajlar 8
  • Beğeniler 1 / 4
  • Ticaret 0, (%0)

<script>
$(document).ready(function() {

$('.faq_question').click(function() {

// sınıf isimleri 'open' olan elementleri x değişkenine ata
var x = document.getElementsByClassName('open');
var i;

// sınıf isimleri 'open' olan elementi ya da elementleri kapatıp(animate) sınıfı sil
for (i = 0; i < x.length; i++) {
$(x[i]).find('.faq_answer_container').animate({'height':'0'},500);
$(x[i]).removeClass('open');
}

// 'faq_answer' sınıfının yükseklik özelliğine 'px' stringini ekle ve newHeight değişkenine ata
var newHeight = $(this).closest('.faq').find('.faq_answer').height() +'px';

// tıklanan elemente en yakın 'faq' sınıfında 'faq_answer_container' sınıfını ara ve aç(animate)
$(this).closest('.faq').find('.faq_answer_container').animate({'height':newHeight},500);
// tıklanan elemente en yakın 'faq' sınıfına 'open' sınıfını da ekle
$(this).closest('.faq').addClass('open');

});

});
</script>
ErcanDinsel

kişi bu mesajı beğendi.

wmaraci

ErcanDinsel ErcanDinsel E' Kullanıcı
  • Üyelik 28.01.2012
  • Yaş/Cinsiyet 32 / E
  • Meslek Grafiker. / ercandinsel.org
  • Konum Kocaeli
  • Ad Soyad E** D**
  • Mesajlar 670
  • Beğeniler 54 / 241
  • Ticaret 1, (%100)

qdval adlı üyeden alıntı


<script>
$(document).ready(function() {

$('.faq_question').click(function() {

// sınıf isimleri 'open' olan elementleri x değişkenine ata
var x = document.getElementsByClassName('open');
var i;

// sınıf isimleri 'open' olan elementi ya da elementleri kapatıp(animate) sınıfı sil
for (i = 0; i < x.length; i++) {
$(x[i]).find('.faq_answer_container').animate({'height':'0'},500);
$(x[i]).removeClass('open');
}

// 'faq_answer' sınıfının yükseklik özelliğine 'px' stringini ekle ve newHeight değişkenine ata
var newHeight = $(this).closest('.faq').find('.faq_answer').height() +'px';

// tıklanan elemente en yakın 'faq' sınıfında 'faq_answer_container' sınıfını ara ve aç(animate)
$(this).closest('.faq').find('.faq_answer_container').animate({'height':newHeight},500);
// tıklanan elemente en yakın 'faq' sınıfına 'open' sınıfını da ekle
$(this).closest('.faq').addClass('open');

});

});
</script>


Sen adamsın. :D
 

 

wmaraci
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al