如何从图像地图href激活jquery手风琴？ [英] How to activate jquery accordion from an image map href?

问题描述

我已经四处搜寻，还没有完全找到我特定问题的答案。

I've searched all over and havent quite found the answer for my particular question.

我有一个简单的jquery手风琴，我希望能够激活一个内部链接中的特定部分。该链接来自图像地图，因此查看者单击图像的某个区域并激活了手风琴的该部分。似乎很简单，但我却很难受。

I have a simple jquery accordion and I want to be able to activate a particular section from an internal link. The link is coming from an image map so a viewer clicks on a region of the image and it activates that section of the accordion. Seems simple enough but I'm having a hell of a time with it.

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

So for example I have so far:

$(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>

我知道，根据我发现此代码是与需要的东西相去甚远，但这是我目前能找出的最多的东西。

I know based on what I've been able to find that this code is a ways off from what it needs to be but this is the most I can figure out at the moment.

基于其他一些线程，我能够获得的最接近的结果是使用href＃从外部链接激活部分，但我需要做到这一点

The closest I've been able to get based on some of the other threads is to activate a section from an external link using an href# but I need that to happen without reloading the page.

推荐答案

通过为您的栏目标题提供 id 属性，您只需对它们进行 click（），它将激活下拉菜单中的该部分：

By giving your section headings id attributes, you can simply click() on them and it will activate that section of the drop down:

<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 -->

在您的区域标签中，可以添加 onclick 属性如下：

In your area tags, you can add onclick attributes like so:

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

这篇关于如何从图像地图href激活jquery手风琴？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！