Page 1 of 1

IPAD buttons rollover

PostPosted: Wed Feb 18, 2015 7:09 pm
by hlfilliez
Is there any way to make the submenu close after a certain time limit? The menus work fine if you hover over but on the ipad or iphone since there is no hover, you can click on the menu button for sub menus. The unfortunate issue I am having is that the sub menu stays open. I am looking for a way to have it close automatically since there is no hover over on a tablet.

Re: IPAD buttons rollover

PostPosted: Fri Feb 20, 2015 6:47 pm
by Aivars
No, on touch devices the menus can be opened and closed by touch but they won't close automatically. I don't think closing menus automatically on touch devices would be a standard behavior but in case I'm mistaken, do you have any samples of sites that do this?

Re: IPAD buttons rollover

PostPosted: Mon Feb 23, 2015 4:36 pm
by hlfilliez
My issue is that if you click on the menu button, it opens the side menu but if you click on it again, it does not close it. You have to click somewhere else in the page. I would be happy if you could just click the button again and it will close. Here is our test site if you can look at it with an ipad or tablet.

https://www.edisonnationalbank.com/testsite2

Thanks,
Harold

Re: IPAD buttons rollover

PostPosted: Fri Feb 27, 2015 1:35 pm
by Aivars
Right now it's like this:
- if you click once, submenu opens
- if you click second time, url gets loaded in case the top menu button has a link set.

I suppose that in those cases where top menu button doesn't have a link we could close the submenu on the second click instead. I'll add this to suggestions.

Re: IPAD buttons rollover

PostPosted: Tue May 26, 2015 7:08 pm
by marleensalogm
stmarytampa.org - menu links and sub menu links are not working on ipad or iphone. Here is my code...
<link rel="stylesheet" href="/menufiles/mbcsmbmenueb031115.css" type="text/css" />


<div id="mbmenueb031115ebul_wrapper" style="width: 120px;">
<ul id="mbmenueb031115ebul_table" class="mbmenueb031115ebul_menulist css_menu">
<li class="with_submenu"><div class="arrow buttonbg"><a href="http://www.stmarytampa.org/">Home</a></div>
<ul>
<li><a href="http://goo.gl/Mczs5c" title="">Announcements</a></li>
<li class="last_item"><a href="http://www.stmarytampa.org/churchtour.html" title="">Church Tour</a></li>
</ul></li>
<li class="with_submenu"><div class="arrow buttonbg"><a href="http://www.stmarytampa.org/liturgicalministry.html">Liturgy</a></div>
<ul>
<li><a href="http://www.stmarytampa.org/liturgicalministry.html" class="with_arrow" title="">Liturgical Ministry</a>
<ul>
<li><a href="http://www.stmarytampa.org/liturgicalministry.html" title="">Altar Server</a></li>
<li><a href="http://www.stmarytampa.org/liturgicalministry.html" title="">Eucharistic Minister</a></li>
<li><a href="http://www.stmarytampa.org/liturgicalministry.html" title="">Music</a></li>
<li><a href="http://www.stmarytampa.org/liturgicalministry.html" title="">Reader</a></li>
<li><a href="http://www.stmarytampa.org/liturgicalministry.html" title="">Sacristan</a></li>
<li class="last_item"><a href="http://www.stmarytampa.org/liturgicalministry.html" title="">Usher</a></li>
</ul></li>
<li class="last_item"><a href="http://www.stmarytampa.org/funerals.html" title="">Funerals</a></li>
</ul></li>
<li class="with_submenu"><div class="arrow buttonbg"><a href="http://www.stmarytampa.org/faithformation.html">Faith Formation</a></div>
<ul>
<li><a href="http://www.stmarytampa.org/catholicschools.html" title="">Catholic Schools</a></li>
<li class="last_item"><a href="http://www.stmarytampa.org/rcia.html" title="">RCIA</a></li>
</ul></li>
<li class="with_submenu"><div class="arrow buttonbg"><a href="http://www.stmarytampa.org/outreach.html">Outreach</a></div>
<ul>
<li><a href="http://www.stmarytampa.org/pastoralcare.html" title="">Pastoral Care</a></li>
<li class="last_item"><a href="http://www.stmarytampa.org/santamariamission.html" title="">Santa Maria Mission</a></li>
</ul></li>
<li class="with_submenu"><div class="arrow buttonbg"><a href="http://www.stmarytampa.org/community.html">Community</a></div>
<ul>
<li><a href="http://www.stmarytampa.org/community.html" title="">Bible Study</a></li>
<li><a href="http://www.stmarytampa.org/community.html" title="">Knights of Columbus</a></li>
<li><a href="http://www.stmarytampa.org/community.html" title="">Men's Club</a></li>
<li><a href="http://www.stmarytampa.org/community.html" title="">Newcomers</a></li>
<li><a href="http://www.stmarytampa.org/community.html" title="">Quilters</a></li>
<li><a href="http://www.stmarytampa.org/community.html" title="">Scouts</a></li>
<li class="last_item"><a href="http://www.stmarytampa.org/community.html" title="">Women's Council</a></li>
</ul></li>
<li class="with_submenu"><div class="arrow buttonbg"><a href="http://www.stmarytampa.org/sacraments.html">Sacraments</a></div>
<ul>
<li><a href="http://www.stmarytampa.org/sacraments.html" title="">Anointing of the Sick</a></li>
<li><a href="http://www.stmarytampa.org/sacraments.html" title="">Baptism</a></li>
<li><a href="http://www.stmarytampa.org/sacraments.html" title="">Confirmation</a></li>
<li><a href="http://www.stmarytampa.org/sacraments.html" title="">Eucharist</a></li>
<li><a href="http://www.stmarytampa.org/sacraments.html" title="">Holy Orders</a></li>
<li><a href="http://www.stmarytampa.org/sacraments.html" title="">Marriage</a></li>
<li class="last_item"><a href="http://www.stmarytampa.org/sacraments.html" title="">Reconciliation</a></li>
</ul></li>
<li class="with_submenu"><div class="arrow buttonbg"><a href="http://www.stmarytampa.org/stewardship.html">Stewardship</a></div>
<ul>
<li><a href="http://www.stmarytampa.org/stewardship.html" title="">Annual Pastoral Appeal</a></li>
<li><a href="http://www.stmarytampa.org/forwardinfaith.html" title="">Forward In Faith</a></li>
<li class="last_item"><a href="http://www.stmarytampa.org/renovation.html" title="">Renovation, Capital Campaign</a></li>
</ul></li>
<li class="with_submenu"><div class="arrow buttonbg"><a href="http://www.stmarytampa.org/contactus.html">Contact Us</a></div>
<ul>
<li><a href="http://www.stmarytampa.org/committees.html" class="with_arrow" title="">Committees</a>
<ul>
<li><a href="http://www.stmarytampa.org/committees.html" title="">Finance</a></li>
<li class="last_item"><a href="http://www.stmarytampa.org/committees.html" title="">Pastoral</a></li>
</ul></li>
<li><a href="http://goo.gl/bIYuV8" title="">Forms</a></li>
<li class="last_item"><a href="http://goo.gl/Plb5FY" title="">Staff Directory</a></li>
</ul></li>
<li class="with_submenu"><div class="arrow buttonbg"><a>Other Links</a></div>
<ul>
<li><a href="http://dosp.org/tribunal/annulments/" title="">Annulments</a></li>
<li><a href="http://bethany.catholicweb.com/" title="">Bethany Center</a></li>
<li><a href="http://bustedhalo.com/" title="">Busted Halo</a></li>
<li><a href="http://www.dosp.org/" title="">Diocese of St. Petersburg</a></li>
<li><a href="http://thefloridacatholic.org/iv/feb_6-19_2015_issue?parent_cat_id=3155" title="">FL Catholic News</a></li>
<li><a href="http://www.franciscancentertampa.org/" title="">Franciscan Center</a></li>
<li><a href="http://www.masstimes.org/" title="">Mass Times for Travelers</a></li>
<li><a href="http://www.spiritfm905.com/" title="">Spirit FM Broadcast</a></li>
<li><a href="http://www.usccb.org/" title="">USC Catholic Bishops</a></li>
<li><a href="http://w2.vatican.va/content/vatican/en.html" title="">Vatican The Holy See</a></li>
<li class="last_item"><a href="http://www.spvocation.org/" title="">Vocations</a></li>
</ul></li>
</ul>
</div>
<!-- Menus will work without this javascript file. It is used only for extra
effects, improved usability, compatibility with very old web browsers
and support for touch screen devices. -->
<script type="text/javascript" src="/menufiles/mbjsmbmenueb031115.js"></script>