#1
  1. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    May 2004
    Location
    Boston, MA USA
    Posts
    585
    Rep Power
    51

    Error in Responsive Cascading Menu


    Hi:

    I have a web site which is built on a Responsive Framework. The main navigation menu uses "nested" UL's and works perfectly on a computer web browser. However, when viewed on a mobile device (phone or tablet), parts of the menu don't work (can't click them). The odd thing is if I go to a specific submenu, then the rest of the menu suddenly does work.

    And... on a computer, if I resist the browser to the size of a mobile device the entire menu works exactly as expected...

    I have posted some of the code below. I have removed some of the discrete line items to simplify but the complete structure is there. On a mobile device, when I first land on the hime page, none of the menu links work... But if I click the "Home" link, the sub-items unfold but the rest of the menu is still inactive. Then, If I click the "Change Show" menu item, suddenly the entire rest of the menu works fine.

    I've gone through the code multiple times and I can't figure out what's causing this.

    Perhaps another set of eyes can see something I am missing.

    Thanks

    (Sorry for the long post, the original menu file is about 300 lines long)

    PHP Code:
    <?php
    echo "
    <!-- Master Nav -->
    <nav class=\"main-menu\">
    <ul>
        <li><a href=\"admin_entrance.php\">Home</a>
            <ul>
                <li><a href=\"logout_mgt.php\">Log Out</a></li>
                <li><a href=\"change_show.php\">Change 
    $domain_label</a></li>
            </ul>
        </li>
        <li><a>Management</a>
            <ul>    
                <li><a href=\"manage_management.php\">Company Info.</a></li>
                <li><a href=\"manage_shows_home.php\">
    $domain_label Info.</a></li>
                <li><a href=\"upload_docs.php\">Upload Files</a></li>
                <li><a href=\"other_brands_prods_servs.php\">\"Other\" Brands, Products, Services List</a></li>
                <li><a href=\"directories_home.php\">Program Directories</a>
                    <ul>
                        <li><a href=\"exhibitors_index.php\"> Exhibitors Index for Show Program   </a></li>
                        <li><a href=\"products_4_web_datasheet.php\"> Products List for Show Program   </a></li>
                        <li><a href=\"exhibitors_product_matrix.php\"> Exhibitor / Product Matrix  </a></li>                    
                    </ul>
                </li>
                <li><a href=\"exhibitors_4_web_datasheet.php?list=exhib&ref=bsm\">Web Page Directories</a>
                    <ul>
                        <li><a href=\"exhibitors_4_web_datasheet.php?list=exhib&ref=bsm\">Exhibitor List For Web</a></li>
                        <li><a href=\"exhibitors_4_web_datasheet.php?list=prodserv&ref=bsm\">Products List For Web</a></li>
                    </ul>
                </li>
        "
    ;

        if    (
    $offer_events == "yes"){
            echo 
    "
                <li><a href=\"events_list.php\">Events</a></li>
            "
    ;
        }

    echo 
    "
            </ul>
        </li>
        <li><a>Biz Dev.</a>
            <ul>
                <li><a href=\"biz_dev_home.php\">My Actions</a></li>
                <li><a href=\"biz_dev_recent.php\">Recent Notes</a></li>
                <li><a href=\"biz_dev_emails.php\"><font color=\"red\"><b><i>New </i></b></font>Save Emails to Biz Dev</a></li>
            </ul>
        </li>
        <li><a>Contacts</a>
            <ul>
                <li><a href=\"contacts.php\">Companies / Contacts</a>
                    <ul>
                        <li><a href=\"contacts.php\"> Search Companies and Contacts</a></li>
                        <li><a href=\"add_company.php\"> Add a New Company</a></li>
                        <li><a href=\"complete_cell_phone_report.php\"> Complete Cell Phone Listing </a></li>
                        <li><a href=\"merge_companies.php\"> <font color=\"FF0000\">Merge Two Company Records</font> </a></li>
                    </ul>
                </li>
                <li><a href=\"password_home.php\">Passwords</a>
                    <ul>
                        <li><a href=\"password_lookup.php\"> Look up an exhibitor's password  </a></li>
                        <li><a href=\"password_list.php\">  Show list of all exhibitors' passwords </a></li>
                        <li><a href=\"access_report.php\">  Show Access Report </a></li>
                        <li><a href=\"unique_login_report.php\">  Unique User Report </a></li>
                        <li><a href=\"select_show.php?show_id=
    $show_id\">  Login as an Exhibitor </a></li>
                    </ul>
                </li>
                <li> <a href = \"#\" onclick=\"window.open('new_email_blast_att.php','name','width=1000,height=750')\">email Blast</a> </li>
                <li> <a href = \"new_email_blast_att.php\"><font color=\"FF0000\">(email Blast same window)</font></a> </li>
                <li><a href=\"emails_log.php\">  Email Log</a></li>
                <li><a href=\"get_blocks.php\">  Undelivered Email</a></li>
            </ul>
        </li>
        <li><a>Sales</a>
            <ul>
                <li><a>Sales Reports</a>
                    <ul>
                        <li><a href=\"forecast_sales.php\">Forecast PLUS Completed Sales </a></li>
                        <li><a href=\"last_years_sales.php\">Last Year's Sales</a></li>
                        <li><a href=\"historical_sales.php\">Historical Sales </a></li>
                    </ul>
                </li>
                
                <li><a href=\"recent_revenue.php\">Revenue Report</a></li>
                <li><a href=\"payment_allocation_report.php\"><font color='FF0000'><i>Allocated</i></font> Revenue Report</a></li>
                <li><a href=\"dealer_rep_report.php\">Dealer / Reps</a></li>
                <li><a href=\"all_prospects.php\">Prospects</a></li>
            </ul>
        </li>

        <li><a>Logistics</a>
            <ul>
                <li><a href=\"logistics_report.php\">Status List</a></li>
                <li><a href=\"missing_payments.php\">Missing Payments</a></li>
                <li><a href=\"notification_home.php\">Notifications</a></li>

                <li><a href=\"recent_exhibitor_uploads.php\">  Recent Exhibitor Uploads </a></li>
            </ul>
        </li>
        <li><a>Inventory</a>
        <ul>
            <li><a href=\"inventory_products.php\">Products</a></li>
            <li><a href=\"available_space_report.php\">Available Spaces</a></li>
            <li><a href=\"badge_allotment_groups.php\">Badge Allocation Groups</a></li>
        </ul>
        </li>
    </ul>
    </nav>
    <!-- /Master Nav -->
    "
    ;
    ?>
  2. #2
  3. Lord of the Dance
    Devshed Specialist (4000 - 4499 posts)

    Join Date
    Oct 2003
    Posts
    4,203
    Rep Power
    2012
    How does your CSS looks like?

    Have you tried to clear the temporary cache on the mobile?

IMN logo majestic logo threadwatch logo seochat tools logo