Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery dropdown menu doesn't work on HTTPS and works on HTTP

After upgrading my website to HTTPS, my jQuery dropdown menu doesn't work anymore on some browsers(firefox, chrome) and works on others(safari, opera). After I manually allow this content to be shown (here: http://puu.sh/6gulp.png ) then it works, but I don't want that ofc... I don't even know what's the real problem in here, I've tried to put my icon pictures in the menu on HTTPS via SSL hosting sites and Dropbox which provide HTTPS image links, and still it didn't shown on HTTPS url. It the same when I remove all the image icons as well. What could be the problem in here?

This is my jQuery code:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#simple-account-dropdown > .account").click(function(){
            $("#simple-account-dropdown > .dropdown").fadeToggle("fast", function(){
                if($(this).css('display') == "none")
                    $("#simple-account-dropdown > .account").removeClass("active");
                else
                    $("#simple-account-dropdown > .account").addClass("active");
            });
        });
    });
</script>

This is my HTML for the dropdown:

<ul id="container2">
    <li>
        <div id="simple-account-dropdown">
            <div class="account">
                <img src="css/images/avatar.png" alt="Account"/>
                <span>Hello <b><?php echo $username ?></b></span>
                <img src="css/images/arrow.png" alt="Dropdown"/>
            </div>
            <div class="dropdown" style="display: none">
                <ul>
                    <li><a href="profile.php"><img src="images/user-icon.png" alt="Upload"/>Account info</a></li>
                    <li><a href="chgpass.php"><img src="images/pass-icon.png" alt="Upload"/>Change your Password</a></li>
                    <li><a href="login.php"><img src="images/logout.png" alt="Upload"/>Logout</a></li>
                </ul>
            </div>
        </div>
    </li>
</ul>
like image 359
Simon_says Avatar asked Mar 21 '26 17:03

Simon_says


1 Answers

You are doing https to http. Change this

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"></script>

Into this

<script type="text/javascript" src="//code.jquery.com/jquery-1.9.0.min.js"></script>
like image 200
Alex Shilman Avatar answered Mar 24 '26 05:03

Alex Shilman