ใช้ได้บน firefox และ ie ปกติดีคับ แต่ไม่ทำงานบน chrome เป็นเพราะอะใคับ
html
 
<div class="map" id="indexmap"></div>
 

script 

<script  type="text/javascript">
    var indexmap;
    function map_init() {
        indexmap = new longdo.Map({
            placeholder: document.getElementById('indexmap')
        });
        // Hide pop-up and mask
        $("#mask").hide();
        $("#pop-interP").hide();
        $("#pop-Station").hide();
        $("#pop-Area").hide();
        // Size pop-up
        var img_w = 600;
        var img_h = 650;
        // width and height in css.
        $(".pop").css('width', img_w + 'px');
        $(".pop").css('height', img_h + 'px');
        // Get values ​​from the browser window
        var w = $(this).width();
        var h = $(this).height();
        // Centers the popup
        w = (w / 2) - (img_w / 2);
        h = (h / 2) - (img_h / 2);
        $(".pop").css("left", w + "px");
        $(".pop").css("top", h + "px");
        // Function to close the pop-up
        $(".pop-close").click(function () {
            $(".pop").fadeOut('slow');
            $("#mask").fadeOut('slow');
        });
        //right click
        indexmap.Event.bind('beforeContextmenu', function (event) {
            var element1 = document.createElement('div');
            var element2 = document.createElement('div');
            var element3 = document.createElement('div');
            var element4 = document.createElement('div');
            var element5 = document.createElement('div');
            var element6 = document.createElement('div');
            element1.innerHTML = 'สร้างจุดสนใจ';
            element1.style.cursor = 'pointer';
            element1.style.backgroundColor = '#FFF';
            element1.className += ("liMap");
            element1.onclick = function () {
                indexmap.Ui.ContextMenu.visible(false);
                $("#pop-interP").fadeIn('slow');
                $("#mask").fadeIn('slow');
                $.post("contentPopup.html", function (data) {
                    $("#contentPop").html(data);
                });
            };
            element2.innerHTML = 'สร้างสถานี';
            element2.style.cursor = 'pointer';
            element2.style.backgroundColor = '#FFF';
            element2.className += ("liMap");
            element2.onclick = function () {
                indexmap.Ui.ContextMenu.visible(false);
                $('#pop-Station').fadeIn('slow');
                $('#mask').fadeIn('slow');
                $.post("contentPopup.html", function (data) {
                    $("#contentPop").html(data);
                });
            };
            element3.innerHTML = 'สร้างเขตพีืนที่';
            element3.style.cursor = 'pointer';
            element3.style.backgroundColor = '#FFF';
            element3.className += ("liMap");
            element3.onclick = function () {
                indexmap.Ui.ContextMenu.visible(false);
                $('#pop-Area').fadeIn('slow');
                $('#mask').fadeIn('slow');
                $.post("contentPopup.html", function (data) {
                    $("#contentPop").html(data);
                });
            };
            element4.innerHTML = 'วัดระยะ';
            element4.style.cursor = 'pointer';
            element4.style.backgroundColor = '#FFF';
            element4.className += ("liMap");
            element5.innerHTML = 'พิมพ์';
            element5.style.cursor = 'pointer';
            element5.style.backgroundColor = '#FFF';
            element5.className += ("liMap");
            element6.innerHTML = 'แสดงข้อมูล';
            element6.style.cursor = 'pointer';
            element6.style.backgroundColor = '#FFF';
            element6.className += ("liMap");


            event.add(element1);
            event.add(element2);
            event.add(element3);
            event.add(element4);
            event.add(element5);
            event.add(element6);
        });
    }
</script>