我正在使用Bootstrap(最新版本3.4.4)作为我的响应式框架。 我也在使用jQuery v1.11.0。
我的网站在计算机(Safari,Firefox,Chrome,IE)中工作正常,但是当我尝试在手机上打开我的网站时,响应式菜单无效。 我可以看到菜单,菜单正在折叠确定,但是当我点击选项菜单时没有做任何事情。链接不会移动到所选选项。
它在iPad和某些Android手机中工作正常,但大多数都没有用。 我尝试过iPhone 4,5,6和BQ E5,BQ E6。
我研究了很多,我尝试过不同版本的Bootstrap,但无法找到问题的解决方案。 我希望你能帮助我。
我的网站是:http://mobile.solucionlegal.es/web/
这是我的脚本代码:
<!-- Main Scripts-->
<script src="js/jquery.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/custom.js"></script>
<script src="js/jquery.nav.js"></script>
<script src="js/wow.min.js"></script>
<script src="js/rotator.js"></script>
<!--<script src="js/scripts.js"></script>-->
<script type="text/javascript">
$('a').click(function(){
$('html, body').animate({
scrollTop: $( $.attr(this, 'href') ).offset().top
}, 500);
return false;
});
</script>
<script>
$(document).ready(function() {
$('#nav').onePageNav();
$('.do').click(function(e) {
$('#section-4').append('<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>');
e.preventDefault();
});
});
</script>
<script type="text/javascript">$(document).on('click', '.panel-heading span.clickable', function (e) {
var $this = $(this);
if (!$this.hasClass('panel-collapsed')) {
$this.parents('.panel').find('.panel-body').slideUp();
$this.addClass('panel-collapsed');
$this.find('i').removeClass('glyphicon-chevron-up').addClass('glyphicon-chevron-down');
} else {
$this.parents('.panel').find('.panel-body').slideDown();
$this.removeClass('panel-collapsed');
$this.find('i').removeClass('glyphicon-chevron-down').addClass('glyphicon-chevron-up');
}
});
$(document).on('click', '.panel div.clickable', function (e) {
var $this = $(this);
if (!$this.hasClass('panel-collapsed')) {
$this.parents('.panel').find('.panel-body').slideUp();
$this.addClass('panel-collapsed');
$this.find('i').removeClass('glyphicon-chevron-up').addClass('glyphicon-chevron-down');
} else {
$this.parents('.panel').find('.panel-body').slideDown();
$this.removeClass('panel-collapsed');
$this.find('i').removeClass('glyphicon-chevron-down').addClass('glyphicon-chevron-up');
}
});
$(document).ready(function () {
$('.panel-heading span.clickable').click();
$('.panel div.clickable').click();
});
</script>
<script>
new WOW().init();
</script>
<script type="text/javascript">
$(".rotate").textrotator({
animation: "flip", // You can pick the way it animates when rotating through words. Options are dissolve (default), fade, flip, flipUp, flipCube, flipCubeUp and spin.
separator: ",", // If you don't want commas to be the separator, you can define a new separator (|, &, * etc.) by yourself using this field.
speed: 3000 // How many milliseconds until the next word show.
});
</script>
<script type="text/javascript">
// Close the navbar if collapsed (small screen) when clicking on a menu link
// From edit 2 on
// http://stackoverflow.com/questions/14203279/bootstrap-close-responsive-menu-on-click/23171593#23171593
$(function () {
$('.navbar-collapse ul li a:not(.dropdown-toggle)').bind('click touchstart', function () {
$('.navbar-toggle:visible').click();
});
});
</script>