如何从图像映射href激活jquery手风琴？

我搜索了所有，并没有找到我的特定问题的答案。如何从图像映射href激活jquery手风琴？

我有一个简单的jquery手风琴，我希望能够从内部链接激活一个特定的部分。该链接来自图像地图，因此观看者点击图像的某个区域并激活手风琴的该部分。似乎很简单，但我有一段时间与它。

因此，例如我到目前为止有：

$(function() { 
$("#myaccordion").accordion({ 
    active: false, 
    autoHeight: false, 
    navigation: true   
}); 
}); 

<img src="Map.png" name="map" width="650" height="336" usemap="#hotspot" id="mymap" /> 

<map name="hotspot" id="hotspot"> 
    <area shape="poly" coords="251,125,241,181,287" href="#section1" target="_self" alt="section1" /> 
    <area shape="poly" coords="155,223,133,194,96" href="#section2" target="_self" alt="section2" /> 
</map> 

<div id="myaccordion"> 
<h3><a href="#section1">Section 1</a></h3> 
<div> 
    <p> 
    Section 1 content 
    </p> 
</div> 
<h3><a href="#section2">Section 2</a></h3> 
<div> 
    <p> 
    Section 2 content 
    </p> 
</div>

我知道基于什么我已经能够找到这段代码是长的路，从什么它需要，但是这是最我现在可以弄清楚。

我已经能够基于其他线程得到最接近的是使用href＃从外部链接激活一个部分，但我需要这种情况发生而无需重新加载页面。

来源

2011-03-23 Justin

通过给你的章节标题id属性，你可以简单地click()他们，它会激活下来下降的那部分：

<h3 id="acc_1"><a href="#section1">Section 1</a></h3> 
<div> 
    <p> 
    Section 1 content 
    </p> 
</div> 
<h3 id="acc_2"><a href="#section2">Section 2</a></h3> 
.... <!-- and so forth -->

在你area标签，你可以添加onclick属性，像这样：

<area shape="poly" onclick="$('#acc_1').click();" coords="251,125,241,181,287" href="#section1" target="_self" alt="section1" />

来源

2011-03-23 22:34:43 typeof

这很好。谢谢！ – Justin 2011-03-25 05:57:54

我想（但我不确定），我知道你想达到什么目的。你为什么不使用'trigger'。这将模拟一个事件。例如，如果您想触发#objectA当您悬停#objectB一个点击，你会使用：

$('#obectB').bind('hover', function() { 
    $('#objectA').trigger('click'); 
});

在你的情况下，点击该链接时，你模拟无论什么对象事件会使你的手风琴做你想做的事。

来源

2011-03-23 22:29:21 rsplak

添加事件会中断图像映射。 – 2011-03-23 22:49:10

调用JavaScript从外形：

<area shape="poly" coords="251,125,241,181,287" href="javascript:yourFunction(someVariable)" target="_self" alt="section1" />

来源

2011-03-23 22:35:43

如何从图像映射href激活jquery手风琴？

回答

相关问题