Arama butonu
Bu konudaki kullanıcılar: 1 misafir, 1 mobil kullanıcı
7
Cevap
612
Tıklama
0
Öne Çıkarma
Jquery ile Css degiştirme ve sayfa çağırma işlemi nasil oluyor
T
9 yıl (5 mesaj)
Er
Konu Sahibi

Merhaba Arkadaşlar projemin mobil versiyonu için Yatay bir menü yapmayı planlıyorum (facebook mobildekine benzer)
Menüde 3 tane yanyana float ettirilmiş <a> elementi var Ben bunları css ile menü butonu tarzında yaptım
{Ana Sayfa | Mesajlar |Hesabım }
Menünün hemen altında ise sitenin içeriklerinin olacağı bir div imiz var


Menü sitenin üst tarafında sabit kalacak. kullanıcı menüdeki Anasayfa/Mesajlar/Hesabım linklerinden birine tıkladığında içeriklerin olacağı div e ilgili PHP sayfası çekilecek ve menüde tıkladığı butonun rengi digerlerine göre daha açık bir renk alacak .Ama bunu yaparken sayfa yenilenmeyecek sadece çekmek istediğim div e verileri alacağım.Umarım anlatabilmişimdir
Bunu nasıl yapabilirim ????Yani Jquery ile div e verileri çekecegim ve tıklanan butonun rengini degistirecegim .Yardımlarınız için şimdiden teşekkür ederim



< Bu ileti mobil sürüm kullanılarak atıldı >

T
9 yıl (5 mesaj)
Er
Konu Sahibi

+



< Bu ileti mobil sürüm kullanılarak atıldı >

X
9 yıl (1117 mesaj)
Yüzbaşı

Dostum selam işlem basit

$(".selectEttiginClass").css("background-color", red")

multiple yapacaksan da dictionary şeklinde parameter geçirirsin. başlıktaki soruna cevap verdim.



T
9 yıl (5 mesaj)
Er
Konu Sahibi

Peki veri çekmek istediğimiz bir div e nasıl veri çekeriz yani mesela facebook mobildeki gibi mesajlara tıklayınca altta bir div açmak ve o div e verileri çekmek istiyorum



< Bu ileti mobil sürüm kullanılarak atıldı >

S
9 yıl (829 mesaj)
Teğmen

jquery'nin onClick fonksiyonu tanımlayıp, içinde divi show() fonksiyonu ile gösterebilirsin. daha sonra veriyi nereden çekeceğine bağlı olarak ajax kullanabilirsin.



M
9 yıl (5771 mesaj)
Yarbay

Div 'i hidden yapabilirsin. jquery ile .togge() metodunu cagirip hide ve show yapabilirsin. Yani hidden ise toggle() cagirince visibile yapar, visible iken hide yapar.
div'in icerisine .html(content) metodu ile istedigini eklersin, sonra da toggle() ile visible yaparsin.

Jquery hangi versiyonu kullaniyorsan API sine tekrar bak ama, bu ozelligin degisecegini sanmiyorum ama IE ile calisip calismayacagindan da emin degilim acikcasi.



< Bu ileti tablet sürüm kullanılarak atıldı >
Bu mesaja 1 cevap geldi.
T
9 yıl (5 mesaj)
Er
Konu Sahibi

quote:

Orijinalden alıntı: Mephalay

Div 'i hidden yapabilirsin. jquery ile .togge() metodunu cagirip hide ve show yapabilirsin. Yani hidden ise toggle() cagirince visibile yapar, visible iken hide yapar.
div'in icerisine .html(content) metodu ile istedigini eklersin, sonra da toggle() ile visible yaparsin.

Jquery hangi versiyonu kullaniyorsan API sine tekrar bak ama, bu ozelligin degisecegini sanmiyorum ama IE ile calisip calismayacagindan da emin degilim acikcasi.

Hocam sağolun toggle yöntemini araştırdım dediğiniz gibi istediğim elementi gizleyip istediğimi görünür yapabiliyorum . Çok işimi yarıyacağından eminim.



Show ve hide metodunu biraz biliyordum ama fonksiyon tetiklenince mesela mesaj div'imizi gösterince tekrar gizlemek (ya da tam tersi) biraz zor oluyor ve açıkçası bu şekilde nasıl kullanacağımı bilmiyordum

Ama toggle metodu eğer element gizliyse görünür yapıyor ,görünürse gizliyor





Ayrıca bunu araştırırken denk geldiğim togleClass yöntemi istedigim html elementinin style sınıflarına müdahale etmeye de yarıyor bu sayede aktif olan sekmenin rengini de değiştirebiliyorum .



Çok çok sağolun çok işime yaradı



Kodları birazdan diğer arkadaşlar için aşağıda paylaşacağım



< Bu ileti mobil sürüm kullanılarak atıldı >

T
9 yıl (5 mesaj)
Er
Konu Sahibi

<html>

<head>

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>

</head>







<style>

#menu {

width:100%;

height:40px;

background-color:#007B81;



}



#mesaj {

display:none;



border:2px solid #000;



}

#mesajlar {

width:100px;

height:100%;







}



.mesajlar_acik {

background-color:#00CBFF;







}



#container {



border:2px solid #ff0000;







}

</style>

<body>



<div id="menu">

<div id="mesajlar">



Mesajlar



</div>

</div>





<div id="mesaj">

<p>Mesajlar bu sayfaya çekilecek</p>



</div>



<div id="container">



<p>Burası ana sayfa</p>



</div>







<script>





$("#mesajlar").click(

function(){



$("#mesaj").toggle(500);

$("#container").toggle(500);



$("#mesajlar").toggleClass("mesajlar_acik");





}

);









</script>



</body>

</html>





Kodlari karıştırmayın diye Sade bir biçimde yazdım düzenleyip mobil tasarımda kullanabilirsiniz



$("#mesaj").toggle(500);

$("#container").toggle(500);

Buradaki 500 değerini azaltıp arttırarak kutuların açılıp kapanma süelerini kontrok edebilir ,







$("#mesajlar").toggleClass("mesajlar_acik");

Buradaki #mesajlar yazan yere clasını toggleClass yazan yerdeki classla degistirmek istediginiz div id'ini yazabilirsiniz





< Bu mesaj bu kişi tarafından değiştirildi TheRedos -- 3 Şubat 2017; 4:57:8 >

< Bu ileti mobil sürüm kullanılarak atıldı >

DH Mobil uygulaması ile devam edin. Mobil tarayıcınız ile mümkün olanların yanı sıra, birçok yeni ve faydalı özelliğe erişin. Gizle ve güncelleme çıkana kadar tekrar gösterme.