Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Nov 2011
    Posts
    31
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Image button problem

    Hey i have a map (belgium) with markers on it, when i press a marker an alert has to appear with some text but it just doesnt appear

    I dont want to use javascript in my html

    this is what i got atm,

    html:

    Code:
     <div class="mapdiv">
                <img class="map" src="images/Map.gif"/>
                <img type="image" id="markerJoly" src="images/dot.png"/>
                <img type="image"  id="markerDielis" src="images/dot.png"/>
                <img type="image"  id="markerRietje" src="images/dot.png"/>
                <img type="image"  id="markerClissen" src="images/dot.png"/>
            </div>
    javascript:

    Code:
    addEventListener("load", Map, false);
    
    
    function Map(event) {
    
    
        var knop1 = document.getElementById("markerJoly");
        if (knop1.onclick){
            AlertBox1();
        }
    
        function AlertBox1() {
            alert("1.")
        }
    
        function AlertBox2() {
            alert("2.")
        }
    
        function AlertBox3() {
            alert("3")
        }
    
        function AlertBox4() {
            alert("4")
        }
    
    }

    Alert doesnt show up, pls help

    Thanks in advance

  • #2
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Code:
      if (knop1.onclick)
    I don't know what you think that does, but it simply tests that knop1 has a property called onclick whose value evaluates true.

    Code:
    if( event.target == knop1 ) /* Won't work < IE9 */
    {
       AlertBox1();
    }

  • #3
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,989
    Thanks
    56
    Thanked 557 Times in 554 Posts
    I thought he was looking for

    Code:
    knop1.onclick=AlertBox1;

  • #4
    New Coder
    Join Date
    Nov 2011
    Posts
    31
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by xelawho View Post
    I thought he was looking for

    Code:
    knop1.onclick=AlertBox1;
    i want that pressing a marker activate that alert

  • #5
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,989
    Thanks
    56
    Thanked 557 Times in 554 Posts
    does that not happen with the code I posted?

  • #6
    New Coder
    Join Date
    Nov 2011
    Posts
    31
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Yea sorry typo ^^

  • #7
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Quote Originally Posted by jdruwe View Post
    i want that pressing a marker activate that alert
    Code:
    <div class="mapdiv" id="mapDiv">
     <img class="map" src="images/Map.gif"/>
     <img type="image" id="markerJoly" src="images/dot.png"/>
     <img type="image"  id="markerDielis" src="images/dot.png"/>
     <img type="image"  id="markerRietje" src="images/dot.png"/>
     <img type="image"  id="markerClissen" src="images/dot.png"/>
    </div>
    
    <script type="text/javascript">
    
    function installListener( obj, evt, func )
    {
      window.attachEvent ? obj.attachEvent(evt,func) : obj.addEventListener( evt.replace( /^on/i, "" ), func, false);  
      
      return func;
    }
    
    installListener( document.getElementById( 'mapDiv' ), 'onclick', clickHandler );
    
    function clickHandler( evt )
    {
      var elem = evt.target || evt.srcElement,
          markers = elem.parentNode.getElementsByTagName( 'img' );
          
      for( var i = 0; markers[ i ]; i++ )
        if( markers[ i ] === elem )
          alert( i + 1 );    
    }
    
    </script>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •