link'in üzerine geldiğinde sayfa içeriğinin gösterilmesi [ÇÖZÜLDÜ]
http://aiondatabase.net/en/mounts/
Burada Datatables içerisindeki linklerin üzerine geldiğinde sayfa içeriğinin bir kısmı gözüküyor bunu nasıl yapabilirim.
Bilen varsa nasıl yapabileceğimi söyleyebilir mi?
NOT: Cevabınızın düzgün gözükmesi için
Markdown a uygun şekilde yazmalısınız.
Tayfun hoca aşağıdaki konuda açıklamış nasıl yazmamız gerektiğini :)
https://prototurk.com/nasil-yapilir/markdown-nedir-nasil-kullanilir
dipnot: Bende daha dün öğrendim bu olayı :)
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (5)
birkaç yıl önce xenforo ile forum hazırlamıştım orada böyle bir eklenti mevcuttu. bu kadar detaylı değil diye hatırlıyorum tabi.
linke kısa bir göz attım. bağlantısını verdiği adresdeki bi idi önizleme yaptırıyor.
burada dinamik modal için bir örnek var yapısal olarak neredeyse aynılar bunun üzerinden giderek modal yerine hovera uyarlabilirsin diye düşünüyorum.
Ee tabiki bu şekilde bir işlem yaparsanız web sitesi yavaşlar render kısmında. Ben sadece size mantığını söyledim. Verdiğiniz sitede javascript ile çok fazla uğraşmışlar. Dediğim gibi burada size kimse oturupda bunu hazırlamaz diğe düşünüyorum. Ancak size mantığı konusunda yardımcı olabiliriz.
Öte yandan javascript ile verinin üzerine gelince dediğiniz gibi bir ajax işlemi gerçekleşmiş ve client'den bir veri çekilmiş gibi duruyor (pek fazla inceleyemedim ama). Bu işlemi yapmanız için biraz javascript gerekecek size.
Eyvallah hocam.Ama bu örnek bana çok basit geldi.
tabloda 50 tane link olduğunu düşünsek.50 sayfanın verisini aynı anda yüklemek gerekecek.
Bu şekilde sayfa çok uzun bir sürede açılır diye tahmin ediyorum.
Örnek verdiğim sitede linkin üzerine geldiğinde şöyle bir get metodu gönderiyor.
http://aiondatabase.net/tip.php?id=item--190100221&l=en&nf=on
ve burdan gelen veriyi yazdırıyor benim aradığım şey tamda bu.
böyle bir get methodunu nasıl gönderirim.
sanırım javascript ile yapmışlar. o konulardada pek bilgim yok :)
Biraz css bilgisi ile yapabilirsiniz, en basit mantığı şu şekilde olur.
Html
<table>
<tr>
<td class="title-hover">
<span>İşlem Bir</span>
<div>
Merhaba Dünya, Ben JsFiddle
</div>
</td>
</tr>
<tr>
<td class="title-hover">İşlem İki</td>
</tr>
<tr>
<td class="title-hover">İşlem Üç</td>
</tr>
</table>
CSS
.title-hover{position: relative}
.title-hover > div{
display: none;
position: absolute;
}
.title-hover:hover > span{
color: red;
}
.title-hover:hover > div{
display: block;
width:400px;
background:#000;
padding:10px;
height:100px;
right:-430px;
top:0px;
}