Question

我已经下载了以下interactive map，我正在尝试将其纳入框架集。我创建了一个main_page.html，其中包含：

<html>
<frameset cols="30%,70%" frameborder=no border=no framespacing=no>
<frame src="map.html" name="frame_map">
<frame src="right.htm" name="frame_chart">
</frameset>
</html>

文件map.html（我购买的）有css和config.js供地图使用。配置引脚的典型代码（可用于地图中的城市）如下：

{
    'shape':'circle',
    'hover': 'Manchester',
    'pos_X':209,
    'pos_Y':300,
    'diameter':8,
    'outline':'#FFCECE',
    'thickness':1,
    'upColor':'#FF0000',
    'overColor':'#FFEE88',
    'downColor':'#00ffff',
    'url':'http://www.html5interactivemaps.com',
    'target':'same_window',
    'enable':true,
},

但是，地图只允许'same_window'或'new_window'作为链接的目标。我希望将其扩展到我的框架集上的右框架（即main_page.html中定义的frame_chart。我认为应该在以下代码中添加... 但是如何？

function addEvent(id,relationId){
    var _obj = $('#'+id);
    var _Textobj = $('#'+id+','+'#'+map_config[id]['namesId']);

    _obj.attr({'fill':map_config[id]['upColor'],'stroke':map_config['default']['borderColor']});
    _Textobj.attr({'cursor':'default'});
    if(map_config[id]['enable'] == true){
        if (isTouchEnabled()) {
            //clicking effect
            _Textobj.on('touchstart', function(e){
                var touch = e.originalEvent.touches[0];
                var x=touch.pageX+10, y=touch.pageY+15;
                var tipw=$('#map-tip').outerWidth(), tiph=$('#map-tip').outerHeight(), 
                x=(x+tipw>$(document).scrollLeft()+$(window).width())? x-tipw-(20*2) : x
                y=(y+tiph>$(document).scrollTop()+$(window).height())? $(document).scrollTop()+$(window).height()-tiph-10 : y
                $('#'+id).css({'fill':map_config[id]['downColor']});
                $('#map-tip').show().html(map_config[id]['hover']);
                $('#map-tip').css({left:x, top:y})
            })
            _Textobj.on('touchend', function(){
                $('#'+id).css({'fill':map_config[id]['upColor']});
                if(map_config[id]['target'] == 'new_window'){
                    window.open(map_config[id]['url']); 
                }else if(map_config[id]['target'] == 'same_window'){
                    window.parent.location.href=map_config[id]['url'];
                }
            })
        }
        _Textobj.attr({'cursor':'pointer'});
        _Textobj.hover(function(){
            //moving in/out effect
            $('#map-tip').show().html(map_config[id]['hover']);
            _obj.css({'fill':map_config[id]['overColor']})
        },function(){
            $('#map-tip').hide();
            $('#'+id).css({'fill':map_config[id]['upColor']});
        })
        //clicking effect
        _Textobj.mousedown(function(){
            $('#'+id).css({'fill':map_config[id]['downColor']});
        })
        _Textobj.mouseup(function(){
            $('#'+id).css({'fill':map_config[id]['overColor']});
            if(map_config[id]['target'] == 'new_window'){
                window.open(map_config[id]['url']); 
            }else if(map_config[id]['target'] == 'same_window'){
                window.parent.location.href=map_config[id]['url'];
            }
        })
        _Textobj.mousemove(function(e){
            var x=e.pageX+10, y=e.pageY+15;
            var tipw=$('#map-tip').outerWidth(), tiph=$('#map-tip').outerHeight(), 
            x=(x+tipw>$(document).scrollLeft()+$(window).width())? x-tipw-(20*2) : x
            y=(y+tiph>$(document).scrollTop()+$(window).height())? $(document).scrollTop()+$(window).height()-tiph-10 : y
            $('#map-tip').css({left:x, top:y})
        })
    }   
}

提前致谢！

Answer 1

试试这个

_Textobj.mouseup(function(){
        $('#'+id).css({'fill':map_config[id]['overColor']});
        if(map_config[id]['target'] == 'new_window'){
            window.open(map_config[id]['url']); 
        }else if(map_config[id]['target'] == 'same_window'){
            window.parent.location.href=map_config[id]['url'];
        }
        // Add to map to your frame with id frame_chart
        else if(map_config[id]['target'] == 'frame')
        {
            document.getElementById('frame_chart').src = map_config[id]['url'];
        }

    });

然后在配置

中添加＆＃39; target＆＃39;＆＃39; frame＆＃39;

我希望它会有所帮助

包含从一帧到另一帧的链接的框架的Html页面（带有交互式地图）

1 个答案: