0

我正在使用 C# 开发 ASP.net2.0 应用程序。本项目使用的 Html 5.0 版本。

我有一个定义坐标的图像,然后单击图像对应部分数据的每个坐标应该是可见的。

例如,如果单击#service 部分"<section class="service">"应显示。如果单击#new_generation,<section class="new_generation">则应显示部分。

它应该使用ajax加载。

 <section role="parallax" class="parallax cf">                      
    <map name="home_menu">
        <area class="selected" shape="poly" coords="140,0,0,105,85,105,225,0" href="#supplier" alt="SUPPLIER">
        <area shape="poly" coords="227,0,87,105,172,105,312,0" href="#service" alt="FULL SERVICE CARRIER">
        <area shape="poly" coords="314,0,174,105,259,105,399,0" href="#new_generation" alt="NEW GENERATION AIRLINE">
        <area shape="poly" coords="401,0,261,105,346,105,486,0" href="#air_freight" alt="AIR FREIGHT CARRIER">
        <area shape="poly" coords="488,0,348,105,433,105,573,0" href="#charter" alt="CHARTER AIRLINE">
        <area shape="poly" coords="575,0,435,105,520,105,660,0" href="#cargo" alt="CARGO & LOGISTICS COMPANY">
        <area shape="poly" coords="662,0,522,105,607,105,747,0" href="#hotel" alt="HOTEL GROUP">
        <area shape="poly" coords="749,0,609,105,694,105,834,0" href="#events" alt="EVENTS ORGANISER">
    </map>
</section>


<section class="home_menu_tabs">
    <section class="supplier selected"></section>
    <section class="service">
        Service Content Here comes from database, should loads using Ajax
    </section>
    <section class="new_generation">
    New Generation Content Here comes from database, should loads using Ajax
    </section>
    <section class="air_freight"></section>
    <section class="charter"></section>
    <section class="cargo"></section>
    <section class="hotel"></section>
    <section class="events"></section>
</section>

请帮助jquery

4

1 回答 1

0

如果您想通过单击任何地图区域来显示该部分

这将有助于

$(function(){

    var sections = $('.home_menu_tabs section');
    sections.hide();
    $('map').on('click', 'area', function(){
        sections.hide();
        var href =$(this).prop('href');
        var sectionClass = href.substr(href.lastIndexOf('#')+1);
        //your ajax code to load content.
        $('.'+sectionClass).show();
    });

});
于 2012-09-21T09:01:32.030 回答