Her bir şey Bugün Cevapla
Ara
Kategoriler
duyuru (1)
soru (55)
müzik (0)
film/dizi (0)
teknik (5)
medikal (0)
sözlük (0)
yabancı dil (0)
yer/yön (1)
alınık/satılık (1)
gönül işleri (3)
hayvan (0)
kayıp (0)
kan aranıyor (0)
ev/kalacak yer (0)
Son Cevaplananlar
[]

css yardımı

effectortheme.tumblr.com

şu adreste fotoğrafların üzerine gelindiğinde sağ üst köşelerinde üç tane buton çıkması olayını kendi blogumda nasıl gerçekleştirebilirim? (temayı inceledim fakat karışık geldi, bir de nasıl üçünün aynı anda gözüktüğünü anlayamadım)

basit bir şekilde anlatabilirseniz ve html/css'ye eklenecek kısımları da ayrı ayrı belirtebilirseniz (geriye sadece url ve koordinatları düzenlemek kalsa) çok mutlu olurum. şimdiden teşekkürler.

 
css ve jquery ile.. wordpress i bilmiyorum nelere izin veriyor, gelişine yazıyorum:

head tag inin içine:
<script src="ajax.googleapis.com" type="text/javascript"></script>
<style>
#img { position:relative }
#img div { position:absolute;top:0;right:0;display:none }
</style>

body içine:

<div id="img">
<a href=""><img src="img.jpg" /></a>
<div>
<a href=""><img src="btn1.jpg" /></a>
<a href=""><img src="btn2.jpg" /></a>
<a href=""><img src="btn3.jpg" /></a>
</div>
</div>
<script>
$('#img').live('mouseover',function() {
$('#img div').show();
}).live('mouseout',function() {
$('#img div').hide();
});
</script>
  • ensar  (18.09.11 23:48:20) 
evet büyük bir kısmını başardım fakat şöyle bir problem var, mouse sayfadaki fotoğraflardan birinin üzerindeyken tüm fotoğrafların üzerinde butonlar çıkıyor.

butonların sadece mouse'un o anda üzerinde olduğu fotoğrafta çıkmasını nasıl sağlayabilirim?
  • weeping guitar  (19.09.11 02:03:22) 
örnekteki fotoğraf yani img.jpg, img id li divin içinde.. body içindeki kodu kopyala yapıştır ile çoğaltıp sadece id yi değiştiricez, ona göre ikinci bir javascript fonksiyonu yazıcaz.. misal:

<div id="img2">
<a href=""><img src="img2.jpg" /></a>
<div>
<a href=""><img src="btn1.jpg" /></a>
<a href=""><img src="btn2.jpg" /></a>
<a href=""><img src="btn3.jpg" /></a>
</div>
</div>
<script>
$('#img2').live('mouseover',function() {
$('#img2 div').show();
}).live('mouseout',function() {
$('#img2 div').hide();
});
</script>
  • ensar  (19.09.11 10:12:07) 
3 tane diyelim, scripti kısaltmak için biraz değiştiricez, style ı da:

<style>
#img, #img2, #img3 { position:relative }
#img div, #img2 div, #img3 div { position:absolute;top:0;right:0;display:none }
</style>

------------
<div id="img">
<a href=""><img src="images/g2.jpg" /></a>
<div>
<a href=""><img src="images/ok.png" /></a>
<a href=""><img src="images/ol.png" /></a>
<a href=""><img src="images/secure.png" /></a>
</div>
</div>

<div id="img2">
<a href=""><img src="images/r3.jpg" /></a>
<div>
<a href=""><img src="images/ok.png" /></a>
<a href=""><img src="images/ol.png" /></a>
<a href=""><img src="images/secure.png" /></a>
</div>
</div>

<div id="img3">
<a href=""><img src="images/r11.jpg" /></a>
<div>
<a href=""><img src="images/ok.png" /></a>
<a href=""><img src="images/ol.png" /></a>
<a href=""><img src="images/secure.png" /></a>
</div>
</div>
<script>
$('#img, #img2, #img3').live('mouseover',function() {
$('div',this).show();
}).live('mouseout',function() {
$('div',this).hide();
});
</script>
  • ensar  (19.09.11 10:18:17) 
şimdi tumblr sayfamda aynı anda 15 tane fotoğraf var ve fotoğrafların tek tek adlarını değil de sınıfını yazabiliyorum sanırım, çünkü "img.jpg" kısmına "PhotoUrl-250" geliyor. Bu şekilde gidersek bundan 15 tane kopyala yapıştır yaptığımda "PhotoUrl-250" sabit kalacağından durum değişir mi bilmem ama yine de deneyeyim.

bir de jquery'de "this" diye bir anahtar varmış galiba, o işe yarar mı burada? evetse nereye, nasıl yazmam lazım onu?
  • weeping guitar  (19.09.11 10:33:35) 
şu en son yazdığınızı diyorum işte, deneyeyim hemen.


  • weeping guitar  (19.09.11 10:35:53) 
evvvet!!
('div',this) problemi çözdü, çok teşekkürler..

  • weeping guitar  (19.09.11 10:39:48) 
1
istatistikler
yardım / hakkında
buraya yazılanların hakları Sir Anthony Hopkins'e aittir.
yazan eden compumaster, ilgilenen eden fader
modere edenler angelus, Artibir, aychovsky, baba jo, basond, compumaster, deckard, duyulmasi gerektigi kadar, fader, fraise, groove salad, kahvegibi, kaymaktutmayansicaksut, kibritsuyu, monstro, pandispanya, robin, ron dennis
bu sitede yazılanların hiçbiri doğru değildir. site içeriği küçükler için sakıncalı olabilir. yazılardan yazarları sorumludur. kaynak göstermeden alıntılanamaz. devlet tarafından atanmış bir kurumun internet üzerinde kimin hangi bilgiye ulaşıp ulaşamayacağına karar vermesi insan haklarına aykırıdır. web siteleri kullanıcıların istekleri doğrultusunda bağlandıkları yerlerdir. kullanıcılar isterlerse bir web sitesine bağlanmayabilirler. bu güçleri ve imkanları mevcuttur. bir kullanıcı bir siteye bağlanmak istiyorsa bu onun tercihi ve hakkıdır. bağlanmak istemiyorsa bu yine onun tercihi ve hakkıdır. halkın kendisine hizmet etmesi için görevlendirdiği kurumlar hadlerini aşıp halka neye ulaşıp ulaşmayacağını bilmeyen cahil cühela muamelesi edemezler. ebeveynlerin çocuklarını sakıncalı içeriklerden koruması için çok sayıda bedava ve ücretli yazılım mevcuttur. bu yazılımlar bir web tarayıcısını kullanmaktan daha karmaşık teknik bilgi gerektirmemektedir. devletin milletini küçük düşürmesi ve ebleh yerine koyması yasaktır. Skimlinks ile linkler üzerinden yönlendirme payı alınmaktadır.