• 23-02-2018, 11:41:45
    #1
    Arkadaşlar merhaba,
    Bir web sitem için özel bir çalışma yapmaya çalışıyorum. Çalışma şu şekilde;
    Türkiye haritası üzerine şubelerimizi işaretledim. "usemap" etiketi ile koordinat belirtip bu şubelerin üzerine gelindiği zaman tıklanabilir hale getirebiliyorum.
    Benim burada yapmak istediğim o ilin üzerine gelindiği zaman başka bir sayfaya yönlendirmek değilde, açılan bir popup pencere ile adres, telefon vb. bilgileri sunabilmek.
    Kullandığım kodlar aşağıdaki şekilde. <area> içerisine "onmouse" over ile yapılabilir diye düşünüyorum ama bunun için bir fonksiyon var mı yada yazılabilir mi bu noktada yetersiz kaldım.
    <center><img src="TurkeySvg.png" usemap="#harita" ></center>
    <map name="harita">
    <area shape="rect" coords="1081,244,1227,347" href="" onmouseover="this.src='samsun.png';">
    </map>
  • 23-02-2018, 17:41:51
    #2
    Pop up pencereden kastınız yeni bir sayfa mı yoksa tıklanılan yerde bir div açmak gibi bir şey mi? Yani şöyle bir şey mi: http://mapacarta.tr.tn/norvecDeneme2/norvec.html
  • 23-02-2018, 18:26:59
    #3
    http://jsfiddle.net/RY9tk/520/
    Burdaki örnekteki gibi area içerisin ID atanımlıyarak tıklayıp açmalı ve tıklayıp kapatmalı bir şekilde yapabilirsin.
    örnek gösterecek olursak
    <center><img src="TurkeySvg.png" usemap="#harita" ></center>
    <map name="harita">
    <area shape="rect" coords="1081,244,1227,347" href="" id="open_popup" onmouseover="this.src='samsun.png';">
    </map>
  • 24-02-2018, 18:31:53
    #4
    mapacarta adlı üyeden alıntı: mesajı görüntüle
    Pop up pencereden kastınız yeni bir sayfa mı yoksa tıklanılan yerde bir div açmak gibi bir şey mi? Yani şöyle bir şey mi: http://mapacarta.tr.tn/norvecDeneme2/norvec.html
    AspavA adlı üyeden alıntı: mesajı görüntüle
    http://jsfiddle.net/RY9tk/520/
    Burdaki örnekteki gibi area içerisin ID atanımlıyarak tıklayıp açmalı ve tıklayıp kapatmalı bir şekilde yapabilirsin.
    örnek gösterecek olursak
    <center><img src="TurkeySvg.png" usemap="#harita" ></center>
    <map name="harita">
    <area shape="rect" coords="1081,244,1227,347" href="" id="open_popup" onmouseover="this.src='samsun.png';">
    </map>
    Arkadaşlar aşağıdaki şekilde çözdüm. Bu şekilde yapınca istediğim gibi mouse üzerine gelince istediğim görsel görünüyor.
    <center><img src="TurkeySvg.png" usemap="#harita" ></center>
    <map name="harita">
    <a href="#" onmouseover="document.getElementById('tshirt').style.display='block';" onmouseout="document.getElementById('tshirt').style.display='none';">
    <area shape="rect" coords="1081,244,1227,347" href="" onmouseover="this.src='samsun.png';"></a>
    </map>
    Bu seferde şöyle bir durum oldu. Bu kodları normal bir html dosyası oluşturup baktığım zaman çalışıyor ama wordpress sayfa içerisinde html bölümünde kullanmak istediğim zaman kodlar çalışmıyor.
  • 24-02-2018, 18:35:20
    #5
    darabe adlı üyeden alıntı: mesajı görüntüle
    Arkadaşlar aşağıdaki şekilde çözdüm. Bu şekilde yapınca istediğim gibi mouse üzerine gelince istediğim görsel görünüyor.
    <center><img src="TurkeySvg.png" usemap="#harita" ></center>
    <map name="harita">
    <a href="#" onmouseover="document.getElementById('tshirt').style.display='block';" onmouseout="document.getElementById('tshirt').style.display='none';">
    <area shape="rect" coords="1081,244,1227,347" href="" onmouseover="this.src='samsun.png';"></a>
    </map>
    Bu seferde şöyle bir durum oldu. Bu kodları normal bir html dosyası oluşturup baktığım zaman çalışıyor ama wordpress sayfa içerisinde html bölümünde kullanmak istediğim zaman kodlar çalışmıyor.

    sayfa uzantısın .php ye çevirip denediniz mi
  • 24-02-2018, 19:17:49
    #6
    AspavA adlı üyeden alıntı: mesajı görüntüle
    sayfa uzantısın .php ye çevirip denediniz mi
    Şöyle ki; wordpress de yeni sayfa oluşturup içerisine bu kodları gömüyorum. Ana resim geliyor ama üzerinde olmasını istediğim aksiyon gerçekleşmiyor.