我无法让这些部分显示出来,我非常困难,不再知道我做错了什么。我做的最后一次更改,使部分在他们以前使用jquery时停止显示,我在菜单部分编写了一个jquery菜单。我成功编写了jquery菜单,后来发现当我点击链接时,菜单没有隐藏并显示新的部分。我摆弄它认为它只是javascript订单,但我将其更改为不同的订单,问题仍然存在。我不知道你需要知道什么才能找出问题所在,但我会把这些要点放在这里。
这是我正在处理的网站,在菜单中,只有第一个链接编码为jquery,其余的只是主题标签。
<head><meta http-equiv="Content-Type" content="text/html; charset=euc-jp">
<title>Universal Magazine</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/templatemo_main.css">
<link rel="stylesheet" href="css/jquery.fancybox.css">
<!--<link href='http://fonts.googleapis.com/css?family=Cutive' rel='stylesheet' type='text/css'>-->
<link rel="stylesheet" href="css/templatemo_misc.css">
<link rel="stylesheet" href="css/menu.css">
</head>
<body>
<div class="container">
<div class="row">
<a href="#coupons" class="change-section hovers">
<div class="fixed-btn visible-md visible-lg">
<div class="coupons">
<!-- this is a button that i coded to the menu-->
<div class="image">
</div>
</div>
</div>
</a>
<a href="#coupons" class="change-section">
<div class="photo visible-xs visible-sm">
</div>
</a>
</div>
</div>
</body>
est compiled and minified JavaScript -->
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<!--<script src="js/bootstrap.min.js"></script>-->
<script src="js/jquery.backstretch.min.js"></script>
<script src="js/menu.js"></script>
<script src="js/templatemo_script.js"></script>
<!--templatemo_script.js file contents:-->
<script>
/*
Zoom Template
http://www.templatemo.com/preview/templatemo_414_zoom
*/
var menuDisabled = false;
jQuery(function($) {
$(window).load(function() { // makes sure the whole site is loaded
$('#status').fadeOut(); // will first fade out the loading animation
$('#preloader').delay(350).fadeOut('slow'); // will fade out the white DIV that covers the website.
$('#main-wrapper').delay(350).css({'overflow':'visible'});
});
$(document).ready( function() {
loadGoogleMap();
// backstretch for background image
var defaultImgSrc = $('img.main-img').attr('src');
$.backstretch(defaultImgSrc, {speed: 400});
//for image slide on menu item click(normal) and responsive
$(".change-section").on('click',function(e){
e.preventDefault();
if (menuDisabled == false) // check the menu has disabled?
{
menuDisabled = true; // disable to menu
var name = $(this).attr('href');
console.log(name);
// get image url and assign to backstretch for background
var imgSrc = $("img"+name+"-img").attr('src');
$.backstretch(imgSrc, {speed: 400}); //backstretch for background fade in/out
// content zoom in/out
$("section.active").hide('size',{easing: 'easeInQuart', duration: 400},function(){
$(this).removeClass("active");
$(name+"-section").show('size',{easing: 'easeOutQuart', duration: 400},function(){
$(this).addClass("active");
// google map need to resize for animate contents
google.maps.event.trigger(map, 'resize'); // resize map
$.backstretch("resize"); // resize the background image
menuDisabled = false;
});
});
}
return;
});
});
});
var map = '';
function initialize() {
var mapOptions = {
zoom: 14,
center: new google.maps.LatLng(16.8496189,96.1288854)
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}
function loadGoogleMap(){
// load google map
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&' +
'callback=initialize';
document.body.appendChild(script);
}
</script>
<!--jquery menu settings-->
<script type="text/javascript">
$(function() {
/**
* for each menu element, on mouseenter,
* we enlarge the image, and show both sdt_active span and
* sdt_wrap span. If the element has a sub menu (sdt_box),
* then we slide it - if the element is the last one in the menu
* we slide it to the left, otherwise to the right
*/
$('#sdt_menu > li').bind('mouseenter',function(){
var $elem = $(this);
$elem.find('img')
.stop(true)
.animate({
'width':'170px',
'height':'170px',
'left':'0px'
},400,'easeOutBack')
.andSelf()
.find('.sdt_wrap')
.stop(true)
.animate({'top':'140px'},500,'easeOutBack')
.andSelf()
.find('.sdt_active')
.stop(true)
.animate({'height':'170px'},300,function(){
var $sub_menu = $elem.find('.sdt_box');
if($sub_menu.length){
var left = '170px';
if($elem.parent().children().length == $elem.index()+1)
left = '-170px';
$sub_menu.show().animate({'left':left},200);
}
});
}).bind('mouseleave',function(){
var $elem = $(this);
var $sub_menu = $elem.find('.sdt_box');
if($sub_menu.length)
$sub_menu.hide().css('left','0px');
$elem.find('.sdt_active')
.stop(true)
.animate({'height':'0px'},300)
.andSelf().find('img')
.stop(true)
.animate({
'width':'0px',
'height':'0px',
'left':'85px'},400)
.andSelf()
.find('.sdt_wrap')
.stop(true)
.animate({'top':'25px'},500);
});
});
</script>