Menu icon Foundation

Developer | Chicago, IL

I'm a full stack developer specializing in PHP, Ruby on Rails, jQuery, Foundation, Front-End Development, and UX Design.

My Posts

No Content

My Comments

Marc Stevens commented on Vladimir Bogdanic's post over 4 years

The code described by Rafi and Connel is a partial fix but causes a different issue.

Fix: The first touch event after opening the mobile nav is no longer ignored.

New Issue: Now, instead of sliding left to display the sub-navigation (the intended behavior, which was working before... on any touch after the ignored touch), it just redirects to the href link.

Here is the html for our top-bar element (some things may look strange since it's for a cms that parses XML)...

<div class="contain-to-grid main-menu" id="top">
    <nav class="top-bar" data-topbar="">
        <ul class="title-area">
            <li class="name"><a href="/"><span>Columbia College Chicago</span></a></li>
            <li class="toggle-topbar menu-icon"><a href="#"><span> </span></a></li>
            <li class="top-search-mobile">
                <a class="has-search" href="#">
                    <span> </span>
                </a>
            </li>
        </ul>
        <section class="top-bar-section">
            <ul class="left">
                <li class="has-dropdown mega-nav" id="academics"><a href="/academics/index">Academics</a>
                    <ul class="dropdown">
                        <li class="sub-index"><a href="/academics/index">Academics</a></li>
                        <li><a href="/academics/majors-and-programs">Majors &amp; Programs</a></li>
                        <li><a href="/academics/graduate-programs/index">Graduate Programs</a></li>
                        <li><a href="/academics/las-core-curriculum/index">Core Curriculum</a>
                            <ul class="dropdown">
                                <li class="sub-index"><a href="/academics/las-core-curriculum/index">Core Curriculum</a></li>
                                <li><a href="/academics/las-core-curriculum/first-semester-experience">First-Year Seminar</a></li>
                                <li><a href="/academics/special-programs/honors-program">Honors Program</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="/academics/fine-and-performing-arts/index">Fine &amp; Performing Arts</a>
                            <ul class="dropdown">
                                <li class="sub-index"><a href="/academics/fine-and-performing-arts/index">Fine &amp;<br/> Performing Arts</a></li>
                                <li><a href="/academics/fine-and-performing-arts/art-and-design/index">Art + Design</a></li>
                                <li><a href="/academics/fine-and-performing-arts/business-and-entrepreneurship/index">Business &amp; Entrepreneurship</a></li>
                                <li><a href="/academics/fine-and-performing-arts/creative-arts-therapies/index">Creative Arts Therapies</a></li>
                                <li><a href="/academics/fine-and-performing-arts/dance/index">Dance</a></li>
                                <li><a href="/academics/fine-and-performing-arts/fashion-studies/index">Fashion Studies</a></li>
                                <li><a href="/academics/fine-and-performing-arts/music/index">Music</a></li>
                                <li><a href="/academics/fine-and-performing-arts/photography/index">Photography</a></li>
                                <li><a href="/academics/fine-and-performing-arts/theatre/index">Theatre</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="/academics/liberal-arts-and-sciences/index">Liberal Arts &amp; Sciences</a>
                            <ul class="dropdown">
                                <li class="sub-index"><a href="/academics/liberal-arts-and-sciences/index">Liberal Arts &amp;<br/> Sciences</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/asl-english-interpretation/index">ASL-English Interpretation</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/creative-writing/index">Creative Writing</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/education/index">Education</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/english/index">English</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/humanities-history-and-social-sciences/index">Humanities, History &amp; Social Sciences</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/science-and-mathematics/index">Science &amp; Mathematics</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="/academics/media-arts/index">Media Arts</a>
                            <ul class="dropdown">
                                <li class="sub-index"><a href="/academics/media-arts/index">Media Arts</a></li>
                                <li><a href="/academics/media-arts/advertising-and-public-relations/index">Advertising &amp; Public Relations</a></li>
                                <li><a href="/academics/media-arts/audio-arts-and-acoustics/index">Audio Arts &amp; Acoustics</a></li>
                                <li><a href="/academics/media-arts/cinema-art-and-science/index">Cinema Art + Science</a></li>
                                <li><a href="/academics/media-arts/interactive-arts-and-media/index">Interactive Arts &amp; Media</a></li>
                                <li><a href="/academics/media-arts/interdisciplinary-arts/index">Interdisciplinary Arts</a></li>
                                <li><a href="/academics/media-arts/journalism/index">Journalism</a></li>
                                <li><a href="/academics/media-arts/radio/index">Radio</a></li>
                                <li><a href="/academics/media-arts/television/index">Television</a></li>
                            </ul>
                        </li>
                        <li><a href="/academics/faculty/index">Faculty</a></li>
                        <li><a href="/academics/internships">Internships</a></li>
                        <li><a href="/academics/special-programs/index">Special Programs</a></li>
                        <li><a href="/academics/index#resources">Academic Resources</a></li>
                    </ul>
                </li>
                <li class="has-dropdown mega-nav" id="admissions"><a href="/admissions/index">Admissions &amp;<br/> Financial Aid</a>
                    <ul class="dropdown">
                        <li class="sub-index"><a href="/admissions/index">Admissions &amp;<br/> Financial Aid</a></li>
                        <li class="has-dropdown"><a href="/admissions/requirements/index">Requirements &amp; Deadlines</a>
                            <ul class="dropdown">
                                <li><a href="/admissions/requirements/freshman">Freshman</a></li>
                                <li><a href="/admissions/requirements/transfer">Transfer</a></li>
                                <li><a href="/admissions/requirements/graduate">Graduate</a></li>
                                <li><a href="/admissions/requirements/second-bachelors">Second Bachelor's</a></li>
                                <li><a href="/admissions/requirements/returning-students">Returning Students</a></li>
                                <li><a href="/admissions/requirements/student-at-large">Student at Large</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="#">Additional Information</a>
                            <ul class="dropdown">
                                <li><a href="/admissions/additional-information/international">International</a></li>
                                <li class="has-dropdown"><a href="/admissions/additional-information/admitted-students/undergraduate">Admitted Students</a>
                                    <ul class="dropdown">
                                        <li><a href="/admissions/additional-information/admitted-students/undergraduate">Undergraduate</a></li>
                                        <li><a href="/admissions/additional-information/admitted-students/graduate">Graduate</a></li>
                                        <li><a href="/admissions/additional-information/admitted-students/undergraduate#sign-up-for-orientation">Orientation</a></li>
                                    </ul>
                                </li>
                                <li><a href="/admissions/additional-information/veterans">Veterans</a></li>
                                <li><a href="/admissions/additional-information/college-search-advocates">College Search Advocates</a></li>
                                <li><a href="http://www.colum.edu/Academics/HSSI/index.php">High School Summer Institute</a></li>
                                <li><a href="http://comedystudies.com">Comedy Studies</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="/admissions/visit-us/index">Visit Us</a>
                            <ul class="dropdown">
                                <li><a href="/admissions/visit-us/index#open-house">Open House</a></li>
                                <li><a href="/admissions/visit-us/index#graduate-open-house">Graduate Open House</a></li>
                                <li><a href="/admissions/visit-us/index#in-your-area">In Your Area</a></li>
                                <li><a href="/admissions/visit-us/index#virtual-tour">Virtual Tour</a></li>
                            </ul>
                        </li>
                        <li><a href="/admissions/visit-us/campus-tours">Campus Tours</a></li>
                        <li><a href="/admissions/additional-information/financial-aid">Financial Aid</a></li>
                        <li><a href="http://www.colum.edu/tuition">Tuition</a></li>
                        <li><a href="http://www.colum.edu/scholarships">Scholarships</a></li>
                    </ul>
                </li>
                <li class="has-dropdown mega-nav" id="campus-life"><a href="/campus-life/index">Campus Life</a>
                    <ul class="dropdown">
                        <li class="sub-index"><a href="/campus-life/index">Campus Life</a></li>
                        <li><a href="/campus-life/student-spotlights/index">Student Spotlights</a></li>
                        <li><a href="/campus-life/collaborations/index">Collaborations</a></li>
                        <li><a href="/campus-life/blogs/index">Blogs</a></li>
                        <li><a href="/campus-life/housing/index">Housing</a></li>
                        <li><a href="/campus-life/living-in-chicago/index">Living in Chicago</a></li>
                        <li><a href="http://students.colum.edu/activities/student-organizations.php">Student Organizations</a></li>
                        <li><a href="/campus-life/index#support-services">Support Services</a></li>
                        <li><a href="/campus-life/index#health-and-safety">Health Services</a></li>
                        <li><a href="/campus-life/index#health-and-safety">Safety &amp; Security</a></li>
                    </ul>
                </li>
                <li class="has-dropdown mega-nav" id="columbia-now"><a href="/columbia-now/index">Columbia Now</a>
                    <ul class="dropdown">
                        <li class="sub-index"><a href="/columbia-now/index">Columbia Now</a></li>
                        <li><a href="/columbia-now/index#today">Today's Events</a></li>
                        <li><a href="/columbia-now/news/index">News</a></li>
                        <li><a href="/columbia-now/social-media/index">Social Media</a></li>
                        <li><a href="/columbia-now/galleries-and-museums/index">Galleries &amp; Museums</a></li>
                        <li><a href="/columbia-now/performing-arts-centers/index">Performing Arts Centers</a></li>
                        <li><a href="/columbia-now/creative-and-media-spaces/index">Creative &amp; Media Spaces</a></li>
                        <li><a href="/columbia-now/publications/index">Publications</a></li>
                        <!-- <li><a href="/columbia-now/civic-and-cultural-engagement">Civic &amp; Cultural Engagement</a></li> -->
                    </ul>
                </li>
            </ul>
            <ul class="right">
                <li class="top-search mega-nav" id="search">
                    <a class="has-search" href="#"></a>
                </li>
                <li class="has-dropdown info-for"><a href="#">Info For</a>
                    <ul class="dropdown">
                        <li><a href="http://students.colum.edu/">Students</a></li>
                        <li><a href="http://www.colum.edu/giving">Donors</a></li>
                        <li><a href="http://www.colum.edu/alumni">Alumni</a></li>
                        <li><a href="http://www.colum.edu/faculty">Faculty &amp; Staff</a></li>
                        <li><a href="http://students.colum.edu/parents">Parents</a></li>
                        <li><a href="/admissions/additional-information/college-search-advocates">College Search Advocates</a></li>
                        <li><a href="http://about.colum.edu/employers.html">Employers</a></li>
                        <li><a href="http://www.colum.edu/news">Media</a></li>
                    </ul>
                </li>
                <li class="has-dropdown quick-links"><a href="#">Quick Links</a>
                    <ul class="dropdown">
                        <li><a href="/site-map">Site Map</a>
                        </li>
                        <li><a href="/contact">Contact Us</a>
                        </li>
                        <li><a href="/admissions/visit-us/index">Visit Us</a>
                        </li>
                        <li><a href="http://directory.colum.edu/">Directory</a>
                        </li>
                        <li><a href="http://about.colum.edu/">About Columbia</a>
                        </li>
                    </ul>
                </li>
                <li class="has-dropdown about-columbia"><a href="http://about.colum.edu/">About Columbia</a>
                    <ul class="dropdown">
                        <li><a href="http://www.colum.edu/strategicplan" target="_blank">Strategic Plan</a></li>
                        <li><a href="http://about.colum.edu/president">President</a></li>
                        <li><a href="http://about.colum.edu/leadership/">Board of Trustees</a></li>
                        <li><a href="http://about.colum.edu/academic-affairs">Academic Leadership</a></li>
                        <li><a href="http://about.colum.edu/archives/college-history/">History</a></li>
                        <li><a href="http://about.colum.edu/mission.html">Mission</a></li>
                        <li><a href="http://about.colum.edu/facts/">Fast Facts</a></li>
                        <li><a href="http://about.colum.edu/annualreports/">Annual Report</a></li>
                        <li><a href="http://about.colum.edu/consumer-information.html">Consumer Information</a></li>
                        <li><a href="http://about.colum.edu/human-resources/employment.html">Careers at Columbia</a></li>
                        <li><a href="http://www.lib.colum.edu/">Library</a></li>
                        <li><a href="http://directory.colum.edu/">Directory</a></li>
                    </ul>
                </li>
                <li>
                    <a href="http://www.colum.edu/strategicplan" onclick="ga('send', 'event',{'eventCategory': 'Outbound','eventAction': 'Strategic Plan button','eventLabel': 'page: ' + document.location.pathname});" target="_blank">
                        <img alt="Achieving Our Greatness - Strategic Planning Process" height="30" src="http://www.colum.edu/img/mega-nav/strategic-plan-50.png" width="30" />
                    </a>
                </li>
            </ul>
        </section>
    </nav>
</div>


Marc Stevens commented on Vladimir Bogdanic's post over 4 years

Will inspecting it work? The site is live here...

http://www.colum.edu/

On an iPhone...

1) Touch the topbar menu icon (that works fine and opens the mobile navigation)
2) Touch any of the submenu items, for example, "ACADEMICS" (this touch is ignored)

After that ignored touch, subsequent touches work as expected.

Marc Stevens commented on Vladimir Bogdanic's post over 4 years

Hi Rafi,

I'm looking forward to trying the workaround you mentioned, and will definitely mark your post as helpful if it works.

Just wanted to chime in here and say it's definitely not just an issue with Windows based "touch" devices, since it's still an issue with the following configuration:

iPhone 5s
iOS 8.3
Foundation 5.5

Marc Stevens commented on Vladimir Bogdanic's post about 5 years

This is still happening, and our site is in production :(

Any updates or ideas on this?

http://colum.edu

On an iPhone 5s, I expand the topbar mobile nav (with one touch), that works as expected.

Then, the next touch is ignored, no matter which link.

Subsequent touches after that work properly.

Marc Stevens commented on Ulrich Ullmann's post over 5 years

I'm noticing the same behavior. Has anyone figured out how to fix this without having to disable swipe?

Marc Stevens commented on Vladimir Bogdanic's post over 5 years

I have the same issue with Foundation 5.2.2.

On touch devices only, after expanding the top bar menu, it ignores the first "click" or "touch" of any menu item. After that it works as expected.

http://colum.herokuapp.com
user: colum
pass: heroku

Help!

Marc Stevens commented on Luis Antonio Gómez's post over 5 years

We're seeing that same behavior in Chrome on Android. Swiping does not work.

However, it appears to be working on the native browser, as well as Firefox and Dolphin.

Foundation 5.2.1
Android 4.4.2

Marc Stevens commented on Steve Trask's post about 6 years

I was having the same issue and tried Brandon's suggestion, but now Orbit doesn't seem to be working. I only see the first slide. Maybe I would need to re-initialize orbit on the 'replace' event?

EIther way, it seems less than ideal. I'd rather have one orbit slider that uses interchange for images than three separate sliders that I have to manage and initialize separately.

For now, I'm just triggering an interchange reflow after 500 milliseconds, and it seems to be resizing orbit based on the current interchange image. But not ideal, as hardcoding that delay time seems dangerous.

setTimeout(function() {
$(document).foundation('interchange', 'reflow');
}, 500);

Marc Stevens commented on Gerhard's post about 6 years

I'm seeing this behavior as well. It seems like it's triggering before_slide_change() without actually changing the slide. I have next_on_click set to false.

Posts Followed






Following

    No Content

Followers

My Posts

No Content

My Comments

You commented on Vladimir Bogdanic's post over 4 years

The code described by Rafi and Connel is a partial fix but causes a different issue.

Fix: The first touch event after opening the mobile nav is no longer ignored.

New Issue: Now, instead of sliding left to display the sub-navigation (the intended behavior, which was working before... on any touch after the ignored touch), it just redirects to the href link.

Here is the html for our top-bar element (some things may look strange since it's for a cms that parses XML)...

<div class="contain-to-grid main-menu" id="top">
    <nav class="top-bar" data-topbar="">
        <ul class="title-area">
            <li class="name"><a href="/"><span>Columbia College Chicago</span></a></li>
            <li class="toggle-topbar menu-icon"><a href="#"><span> </span></a></li>
            <li class="top-search-mobile">
                <a class="has-search" href="#">
                    <span> </span>
                </a>
            </li>
        </ul>
        <section class="top-bar-section">
            <ul class="left">
                <li class="has-dropdown mega-nav" id="academics"><a href="/academics/index">Academics</a>
                    <ul class="dropdown">
                        <li class="sub-index"><a href="/academics/index">Academics</a></li>
                        <li><a href="/academics/majors-and-programs">Majors &amp; Programs</a></li>
                        <li><a href="/academics/graduate-programs/index">Graduate Programs</a></li>
                        <li><a href="/academics/las-core-curriculum/index">Core Curriculum</a>
                            <ul class="dropdown">
                                <li class="sub-index"><a href="/academics/las-core-curriculum/index">Core Curriculum</a></li>
                                <li><a href="/academics/las-core-curriculum/first-semester-experience">First-Year Seminar</a></li>
                                <li><a href="/academics/special-programs/honors-program">Honors Program</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="/academics/fine-and-performing-arts/index">Fine &amp; Performing Arts</a>
                            <ul class="dropdown">
                                <li class="sub-index"><a href="/academics/fine-and-performing-arts/index">Fine &amp;<br/> Performing Arts</a></li>
                                <li><a href="/academics/fine-and-performing-arts/art-and-design/index">Art + Design</a></li>
                                <li><a href="/academics/fine-and-performing-arts/business-and-entrepreneurship/index">Business &amp; Entrepreneurship</a></li>
                                <li><a href="/academics/fine-and-performing-arts/creative-arts-therapies/index">Creative Arts Therapies</a></li>
                                <li><a href="/academics/fine-and-performing-arts/dance/index">Dance</a></li>
                                <li><a href="/academics/fine-and-performing-arts/fashion-studies/index">Fashion Studies</a></li>
                                <li><a href="/academics/fine-and-performing-arts/music/index">Music</a></li>
                                <li><a href="/academics/fine-and-performing-arts/photography/index">Photography</a></li>
                                <li><a href="/academics/fine-and-performing-arts/theatre/index">Theatre</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="/academics/liberal-arts-and-sciences/index">Liberal Arts &amp; Sciences</a>
                            <ul class="dropdown">
                                <li class="sub-index"><a href="/academics/liberal-arts-and-sciences/index">Liberal Arts &amp;<br/> Sciences</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/asl-english-interpretation/index">ASL-English Interpretation</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/creative-writing/index">Creative Writing</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/education/index">Education</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/english/index">English</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/humanities-history-and-social-sciences/index">Humanities, History &amp; Social Sciences</a></li>
                                <li><a href="/academics/liberal-arts-and-sciences/science-and-mathematics/index">Science &amp; Mathematics</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="/academics/media-arts/index">Media Arts</a>
                            <ul class="dropdown">
                                <li class="sub-index"><a href="/academics/media-arts/index">Media Arts</a></li>
                                <li><a href="/academics/media-arts/advertising-and-public-relations/index">Advertising &amp; Public Relations</a></li>
                                <li><a href="/academics/media-arts/audio-arts-and-acoustics/index">Audio Arts &amp; Acoustics</a></li>
                                <li><a href="/academics/media-arts/cinema-art-and-science/index">Cinema Art + Science</a></li>
                                <li><a href="/academics/media-arts/interactive-arts-and-media/index">Interactive Arts &amp; Media</a></li>
                                <li><a href="/academics/media-arts/interdisciplinary-arts/index">Interdisciplinary Arts</a></li>
                                <li><a href="/academics/media-arts/journalism/index">Journalism</a></li>
                                <li><a href="/academics/media-arts/radio/index">Radio</a></li>
                                <li><a href="/academics/media-arts/television/index">Television</a></li>
                            </ul>
                        </li>
                        <li><a href="/academics/faculty/index">Faculty</a></li>
                        <li><a href="/academics/internships">Internships</a></li>
                        <li><a href="/academics/special-programs/index">Special Programs</a></li>
                        <li><a href="/academics/index#resources">Academic Resources</a></li>
                    </ul>
                </li>
                <li class="has-dropdown mega-nav" id="admissions"><a href="/admissions/index">Admissions &amp;<br/> Financial Aid</a>
                    <ul class="dropdown">
                        <li class="sub-index"><a href="/admissions/index">Admissions &amp;<br/> Financial Aid</a></li>
                        <li class="has-dropdown"><a href="/admissions/requirements/index">Requirements &amp; Deadlines</a>
                            <ul class="dropdown">
                                <li><a href="/admissions/requirements/freshman">Freshman</a></li>
                                <li><a href="/admissions/requirements/transfer">Transfer</a></li>
                                <li><a href="/admissions/requirements/graduate">Graduate</a></li>
                                <li><a href="/admissions/requirements/second-bachelors">Second Bachelor's</a></li>
                                <li><a href="/admissions/requirements/returning-students">Returning Students</a></li>
                                <li><a href="/admissions/requirements/student-at-large">Student at Large</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="#">Additional Information</a>
                            <ul class="dropdown">
                                <li><a href="/admissions/additional-information/international">International</a></li>
                                <li class="has-dropdown"><a href="/admissions/additional-information/admitted-students/undergraduate">Admitted Students</a>
                                    <ul class="dropdown">
                                        <li><a href="/admissions/additional-information/admitted-students/undergraduate">Undergraduate</a></li>
                                        <li><a href="/admissions/additional-information/admitted-students/graduate">Graduate</a></li>
                                        <li><a href="/admissions/additional-information/admitted-students/undergraduate#sign-up-for-orientation">Orientation</a></li>
                                    </ul>
                                </li>
                                <li><a href="/admissions/additional-information/veterans">Veterans</a></li>
                                <li><a href="/admissions/additional-information/college-search-advocates">College Search Advocates</a></li>
                                <li><a href="http://www.colum.edu/Academics/HSSI/index.php">High School Summer Institute</a></li>
                                <li><a href="http://comedystudies.com">Comedy Studies</a></li>
                            </ul>
                        </li>
                        <li class="has-dropdown"><a href="/admissions/visit-us/index">Visit Us</a>
                            <ul class="dropdown">
                                <li><a href="/admissions/visit-us/index#open-house">Open House</a></li>
                                <li><a href="/admissions/visit-us/index#graduate-open-house">Graduate Open House</a></li>
                                <li><a href="/admissions/visit-us/index#in-your-area">In Your Area</a></li>
                                <li><a href="/admissions/visit-us/index#virtual-tour">Virtual Tour</a></li>
                            </ul>
                        </li>
                        <li><a href="/admissions/visit-us/campus-tours">Campus Tours</a></li>
                        <li><a href="/admissions/additional-information/financial-aid">Financial Aid</a></li>
                        <li><a href="http://www.colum.edu/tuition">Tuition</a></li>
                        <li><a href="http://www.colum.edu/scholarships">Scholarships</a></li>
                    </ul>
                </li>
                <li class="has-dropdown mega-nav" id="campus-life"><a href="/campus-life/index">Campus Life</a>
                    <ul class="dropdown">
                        <li class="sub-index"><a href="/campus-life/index">Campus Life</a></li>
                        <li><a href="/campus-life/student-spotlights/index">Student Spotlights</a></li>
                        <li><a href="/campus-life/collaborations/index">Collaborations</a></li>
                        <li><a href="/campus-life/blogs/index">Blogs</a></li>
                        <li><a href="/campus-life/housing/index">Housing</a></li>
                        <li><a href="/campus-life/living-in-chicago/index">Living in Chicago</a></li>
                        <li><a href="http://students.colum.edu/activities/student-organizations.php">Student Organizations</a></li>
                        <li><a href="/campus-life/index#support-services">Support Services</a></li>
                        <li><a href="/campus-life/index#health-and-safety">Health Services</a></li>
                        <li><a href="/campus-life/index#health-and-safety">Safety &amp; Security</a></li>
                    </ul>
                </li>
                <li class="has-dropdown mega-nav" id="columbia-now"><a href="/columbia-now/index">Columbia Now</a>
                    <ul class="dropdown">
                        <li class="sub-index"><a href="/columbia-now/index">Columbia Now</a></li>
                        <li><a href="/columbia-now/index#today">Today's Events</a></li>
                        <li><a href="/columbia-now/news/index">News</a></li>
                        <li><a href="/columbia-now/social-media/index">Social Media</a></li>
                        <li><a href="/columbia-now/galleries-and-museums/index">Galleries &amp; Museums</a></li>
                        <li><a href="/columbia-now/performing-arts-centers/index">Performing Arts Centers</a></li>
                        <li><a href="/columbia-now/creative-and-media-spaces/index">Creative &amp; Media Spaces</a></li>
                        <li><a href="/columbia-now/publications/index">Publications</a></li>
                        <!-- <li><a href="/columbia-now/civic-and-cultural-engagement">Civic &amp; Cultural Engagement</a></li> -->
                    </ul>
                </li>
            </ul>
            <ul class="right">
                <li class="top-search mega-nav" id="search">
                    <a class="has-search" href="#"></a>
                </li>
                <li class="has-dropdown info-for"><a href="#">Info For</a>
                    <ul class="dropdown">
                        <li><a href="http://students.colum.edu/">Students</a></li>
                        <li><a href="http://www.colum.edu/giving">Donors</a></li>
                        <li><a href="http://www.colum.edu/alumni">Alumni</a></li>
                        <li><a href="http://www.colum.edu/faculty">Faculty &amp; Staff</a></li>
                        <li><a href="http://students.colum.edu/parents">Parents</a></li>
                        <li><a href="/admissions/additional-information/college-search-advocates">College Search Advocates</a></li>
                        <li><a href="http://about.colum.edu/employers.html">Employers</a></li>
                        <li><a href="http://www.colum.edu/news">Media</a></li>
                    </ul>
                </li>
                <li class="has-dropdown quick-links"><a href="#">Quick Links</a>
                    <ul class="dropdown">
                        <li><a href="/site-map">Site Map</a>
                        </li>
                        <li><a href="/contact">Contact Us</a>
                        </li>
                        <li><a href="/admissions/visit-us/index">Visit Us</a>
                        </li>
                        <li><a href="http://directory.colum.edu/">Directory</a>
                        </li>
                        <li><a href="http://about.colum.edu/">About Columbia</a>
                        </li>
                    </ul>
                </li>
                <li class="has-dropdown about-columbia"><a href="http://about.colum.edu/">About Columbia</a>
                    <ul class="dropdown">
                        <li><a href="http://www.colum.edu/strategicplan" target="_blank">Strategic Plan</a></li>
                        <li><a href="http://about.colum.edu/president">President</a></li>
                        <li><a href="http://about.colum.edu/leadership/">Board of Trustees</a></li>
                        <li><a href="http://about.colum.edu/academic-affairs">Academic Leadership</a></li>
                        <li><a href="http://about.colum.edu/archives/college-history/">History</a></li>
                        <li><a href="http://about.colum.edu/mission.html">Mission</a></li>
                        <li><a href="http://about.colum.edu/facts/">Fast Facts</a></li>
                        <li><a href="http://about.colum.edu/annualreports/">Annual Report</a></li>
                        <li><a href="http://about.colum.edu/consumer-information.html">Consumer Information</a></li>
                        <li><a href="http://about.colum.edu/human-resources/employment.html">Careers at Columbia</a></li>
                        <li><a href="http://www.lib.colum.edu/">Library</a></li>
                        <li><a href="http://directory.colum.edu/">Directory</a></li>
                    </ul>
                </li>
                <li>
                    <a href="http://www.colum.edu/strategicplan" onclick="ga('send', 'event',{'eventCategory': 'Outbound','eventAction': 'Strategic Plan button','eventLabel': 'page: ' + document.location.pathname});" target="_blank">
                        <img alt="Achieving Our Greatness - Strategic Planning Process" height="30" src="http://www.colum.edu/img/mega-nav/strategic-plan-50.png" width="30" />
                    </a>
                </li>
            </ul>
        </section>
    </nav>
</div>


You commented on Vladimir Bogdanic's post over 4 years

Will inspecting it work? The site is live here...

http://www.colum.edu/

On an iPhone...

1) Touch the topbar menu icon (that works fine and opens the mobile navigation)
2) Touch any of the submenu items, for example, "ACADEMICS" (this touch is ignored)

After that ignored touch, subsequent touches work as expected.

You commented on Vladimir Bogdanic's post over 4 years

Hi Rafi,

I'm looking forward to trying the workaround you mentioned, and will definitely mark your post as helpful if it works.

Just wanted to chime in here and say it's definitely not just an issue with Windows based "touch" devices, since it's still an issue with the following configuration:

iPhone 5s
iOS 8.3
Foundation 5.5

You commented on Vladimir Bogdanic's post about 5 years

This is still happening, and our site is in production :(

Any updates or ideas on this?

http://colum.edu

On an iPhone 5s, I expand the topbar mobile nav (with one touch), that works as expected.

Then, the next touch is ignored, no matter which link.

Subsequent touches after that work properly.

You commented on Ulrich Ullmann's post over 5 years

I'm noticing the same behavior. Has anyone figured out how to fix this without having to disable swipe?

You commented on Vladimir Bogdanic's post over 5 years

I have the same issue with Foundation 5.2.2.

On touch devices only, after expanding the top bar menu, it ignores the first "click" or "touch" of any menu item. After that it works as expected.

http://colum.herokuapp.com
user: colum
pass: heroku

Help!

You commented on Luis Antonio Gómez's post over 5 years

We're seeing that same behavior in Chrome on Android. Swiping does not work.

However, it appears to be working on the native browser, as well as Firefox and Dolphin.

Foundation 5.2.1
Android 4.4.2

You commented on Steve Trask's post about 6 years

I was having the same issue and tried Brandon's suggestion, but now Orbit doesn't seem to be working. I only see the first slide. Maybe I would need to re-initialize orbit on the 'replace' event?

EIther way, it seems less than ideal. I'd rather have one orbit slider that uses interchange for images than three separate sliders that I have to manage and initialize separately.

For now, I'm just triggering an interchange reflow after 500 milliseconds, and it seems to be resizing orbit based on the current interchange image. But not ideal, as hardcoding that delay time seems dangerous.

setTimeout(function() {
$(document).foundation('interchange', 'reflow');
}, 500);

You commented on Gerhard's post about 6 years

I'm seeing this behavior as well. It seems like it's triggering before_slide_change() without actually changing the slide. I have next_on_click set to false.

Posts Followed

Following

  • No Content

Followers

  • No Content