JQuery Accordion Buried in a Table within Dynamic Page_问答_开发者

JQuery Accordion Buried in a Table within Dynamic Page

开发者 https://www.devze.com 2023-01-25 18:41 出处：网络

I\'m trying to access the Moveover property of an Accordion buried under Divs and other stuff.Here is the HTML:

相关专题：jquery

I'm trying to access the Moveover property of an Accordion buried under Divs and other stuff. Here is the HTML:

<body>
    <form id="form1" runat="server" >
    <div id="content" class="content">
    <table style="width: 1200px">
        <tr>
            <td style="width: 800px">
                <h1>Title here</h1><br />
                stuff here.. blah blah..

                <div id="wrapping" class="wrapping">
                    <p class="accordionButton"><strong>Water-Related Services</strong></p>
                    <div class="accordionContent">  
                        Item 1<br />
                        Item 2<br/>
                        Item 3<br />
                    </div>
                    <p class="accordionButton"><strong>Fire and Smoke Problem</strong></p>
                    <div class="accordionContent">
                        Item 1<br />
                        Item 2<br />
                        Item 3<br />
                   </div>
                    <p class="accordionButton"><strong>Mold Problems</strong></p>
                    <div class="accordionContent">
                        Mold Remediation<br />
                   </div>                       
                </div>
              </td>
              <td style="width:auto; text-align:center">
              <p style="text-align:center; font-size:xx-large; color:Red">CALL TODAY</p><br />                   
              </td>
          </tr>

    </table>
</div>

Here is the portion of the script I'm using to TRY to access the Accordion buttons:

    $('.wrapping').find('p.accordionButton').mouseover(function() {
        $('div.accordionContent').slideUp('normal');
        $(this).next().slideDown('normal');
    });

I've placed an ALERT command inside the Mouseover function and it never fires, so I know I'm not reaching the Accordion button properly. Can anyone help?

Added: Here is the entire JQuery script. It's not big, but it's redundant. I have this ASP.NET page as a dynamic web page. I know I have redundancies, but I'm new at JQuery:

// Check for hash value in URL

var hash = window.location.hash.substr(1);

var href = $('#nav li a').each(function(){   
    var href = $(this).attr('href');   
    if(hash==href.substr(0,href.length-4)){   
        var toLoad = hash + '.htm #content';   
        $('#content').load(toLoad)   
    }
    });

$(document).ready(function() {

    //ACCORDION BUTTON ACTION    
    $('.wrapping').find('p.accordionButton').mouseover(function() {
        $('div.accordionContent').slideUp('normal');
        $(this).next().slideDown('normal');
    });

    //HIDE THE DIVS ON PAGE LOAD    
    $(".accordionContent").hide();



    if (hash=="") {
        $('#content').load("welcome.aspx #content", showNewContent());
    }   

    $('#nav li a').click(function(){   
        var toLoad = $(this).attr('href')+' #content';
        $('#content').hide('fast',loadContent);
        $('#wrapper').append('<span id="load">LOADING...</span>');   
        $('#load').fadeIn('normal');

        function loadContent() {
            $('#content').load(toLoad,'',showNewContent())   
        } 
        function showNewContent() {   
            $('#content').show(hideLoader());
        } 
       开发者_StackOverflow function hideLoader() {   
            $('#load').fadeOut('normal');   
        }  
        return false;
    }); 

    function loadContent() {
        $('#content').load(toLoad,'',showNewContent())   
    } 
    function showNewContent() {   
        $('#content').show(hideLoader());
    } 
    function hideLoader() {   
        $('#load').fadeOut('normal');   
    }

});

You can try to eliminate this ambiguity: