Result

jQuery

/* Google Map Selector
* Created: Jan 18th, 2011 by DynamicDrive.com. This notice must stay intact for usage 
* Author: Dynamic Drive at http://www.dynamicdrive.com/
* Visit http://www.dynamicdrive.com/ for full source code
*/
var googlemapselector={

    selectaddr:function($addrdiv, $li, $mapiframe){ 
        if ($addrdiv.data('$lastselectedli'))
            $addrdiv.data('$lastselectedli').removeClass('selected')
        $li.addClass('selected')
            //iframeにアドレスを入れる
        window.frames[$mapiframe.attr('name')].location.replace($li.data('addr')) 
            //拡大用のリンクへの埋め込み
        $mapiframe.data('$largemaplink').attr('href', $li.data('addr').replace('&output=embed', '')) 
        $addrdiv.data('$lastselectedli', $li)
    },

    init:function(addrwrapper, mapwrapper, persist){
        jQuery(function($){
            var $mapdiv=$('#'+mapwrapper)
            var $mapiframe=$mapdiv.find('iframe:eq(0)')
            var $addrdiv=$('#'+addrwrapper)
            var $lis=$addrdiv.find('ul.location:eq(0)').find('li')
            var mapiframetarget=$mapiframe.attr('name')
            var $largemaplink=$mapdiv.find('a.largermap') //class="largermap"を探す
            $mapiframe.data('$largemaplink', $largemaplink) //拡大用リンクをdata()で格納する
            $lis.each(function(){
                var $li=$(this)
                var $address=$li.find('a[href^="http://maps.google.com"]') //li内のGoogle mapリンクを探す
                $address.each(function(){
                    var $addr=$(this)
                    $addr.attr({href:this.getAttribute('href')+'&output=embed', target:mapiframetarget}) //属性追加
                    $addr.click(function(e){
                        //Google mapをロードする。切り替え時にリクエストするのでページのロード時間を抑えられます。
                        googlemapselector.selectaddr($addrdiv, $li, $mapiframe) 
                        e.preventDefault()
                    })
                })
                $li.data('addr', $address.eq(0).attr('href'))
                if ($li.hasClass('selected')){
                    googlemapselector.selectaddr($addrdiv, $li, $mapiframe) 
                    $addrdiv.data('$lastselectedli', $li) 
                    return
                }
            })
        })
    }
}


googlemapselector.init('addrcolumn', 'mapcolumn')

css

#mapcontainer{
overflow:hidden;
width: 800x;
}

#addrcolumn{ 
float:left;
width: 160px;
margin-right:20px;
}

#addrcolumn ul.location{ 
list-style-type: none;
margin: 0;
padding: 0;
}

#addrcolumn ul.location li{
margin-bottom:10px;
position:relative;
padding:10px;
background: #DFDFDF;
}

#addrcolumn ul.location li.selected:after{ 
position:absolute;
content:'';
border-color:transparent transparent transparent #DFDFDF;
left:100%;
top:0;
border-style: solid;
border-width: 15px; 
}

#mapcolumn{ 
float:left;
width: 400px;
}

#mapcolumn iframe{ 
width: 400px;
height:300px;
}

html

<div id="mapcontainer">
<div id="addrcolumn">
<ul class="location">
    <li class="selected"><a href="http://maps.google.com/maps?q=%E6%9D%B1%E4%BA%AC%E9%83%BD%E4%B8%96%E7%94%B0%E8%B0%B7%E5%8C%BA%E5%8C%97%E6%B2%A23-1-3&hl=en&ie=UTF8&ll=35.665987,139.673213&spn=0.00672,0.016512&sll=35.664209,139.66614&sspn=0.006721,0.016512&vpsrc=0&hnear=Japan,+T%C5%8Dky%C5%8D-to+Setagaya-ku%E5%8C%97%E6%B2%A2%EF%BC%93%E4%B8%81%E7%9B%AE%EF%BC%91%E2%88%92%EF%BC%93&t=m&z=17">下北沢ローソン</a>
    </li>

    <li><a href="http://maps.google.com/maps?q=%E9%AB%98%E5%B0%BE%E5%B1%B1&hl=en&ie=UTF8&sll=-16.500451,-151.741447&sspn=0.06345,0.132093&vpsrc=0&hnear=Takaosan+Station,+Japan&t=m&z=13">高尾山</a>
    </li>
</ul>
</div>

<div id="mapcolumn">
<iframe name="mapiframe1" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com?output=embed"></iframe>
<br />+ <a href="http://maps.google.com" class="largermap"">大きい地図で見る</a>
</div>
</div>

via

Dynamic Drive DHTML Scripts- Google Map Selector

Warning: include(/home/youhei0828/kachibito.net/public_html/wp-content/themes/cocoon-master/my-php/jquery-other-snippets.php): Failed to open stream: No such file or directory in /home/youhei0828/kachibito.net/public_html/wp-content/themes/kachibito7_with_cocoon_child/functions-module/shortcode/add-post-myphp.php on line 7

Warning: include(): Failed opening '/home/youhei0828/kachibito.net/public_html/wp-content/themes/cocoon-master/my-php/jquery-other-snippets.php' for inclusion (include_path='.:/opt/php-8.1.29/data/pear') in /home/youhei0828/kachibito.net/public_html/wp-content/themes/kachibito7_with_cocoon_child/functions-module/shortcode/add-post-myphp.php on line 7