JQuery Cycle issue on Firefox

Question

I have a top navigation that renders fine on safari and chrome and mostly on firefox, except for one page. This page is using the Jquery Cycle plugin - when I disable this, the navigation shows as normal. What's strange is that I'm using the Cycle plugin on other pages and there are no issues on those, just on this one page it decides to hide the navigation and I cannot figure why! Here is my full code --> http://jsfiddle.net/surajkap/4zZPN/

Here are the highlights:

<ul class = "navigation-bar">
        <li><a href="/contact" class = "nav-link">CONTACT</a></li>
        <li><a href="/clients" class = "nav-link">CLIENTS</a></li>
        <li><a href="/personal" class = "nav-link">PERSONAL</a></li>
        <li><a href="/fashion" class = "nav-link">FASHION</a></li>
        <li><a href="/portrait" class = "nav-link">PORTRAITS</a></li>
        <li><a href="/party" class = "nav-link">PARTIES</a></li>
</ul>   

<div class = "slideshow">
    {% for photo in gallery %}
    <div class = "slide">
        <img class = "gallery-image" src ="{{ photo.image.url }}"/>
        <div class = "caption-container">
            {% for client in photo.client.all %}
            <div class = "client">client: {{ client.name }}
                <div class = "slide-nav"></div>
            </div>
            {% endfor %}    
            <span class = "caption">{{ photo.caption }}</span>
        </div>
    </div>
    {% endfor %}    
</div>  

CSS...

.navigation-bar {
        width: 100%;
        float: right;
        margin: 0px;
        padding: 0px;
        list-style: none;
        background-color: black;}

and the Jquery...

$(document).ready(function(){
    $(".slideshow")
        .cycle({
        fx: 'scrollHorz',
        next: '.right-arrow',
        prev: '.left-arrow',
        timeout: 0,
        pager: '.slide-nav',
        pagerAnchorBuilder: function paginate(idx, el) {
                    return '<a class="bullet" href="#" >&bull;</a>'

        }
    });
});

Answer 1

Since you didn't share any error output in your console, I can only guess that the javascript you're commenting out is throwing an exception (such that when you un-comment it, things work).

You have some syntax issues -- specifically, you've forgotten semi-colons. Try this:

$(document).ready(function(){
    $(".homepage-container")
        .cycle({
        fx: 'fade',
        speed: 'slow',
        timeout: 3000 // Removed "," (which is not required, but still good practice)
    }); // Added ";"
}); // Added ";"

NOTE: If this is not the issue, please post your full HTML (or create a jsFiddle), and the error output of your console (if any).