我有插件初始化的问题。一切正常,除了物化的少量插件 - http://materializecss.com/
放入单个.js文档时,google maps,ul.tabs,parrallax和slider不起作用。
我通过将owl-carousel代码和ul.tabs代码放在单独的文档中解决了这个问题,因此我有init.js,initCarousel.js和initTab.js。当这两部分代码在单独的文档中时,所有插件和所有代码都正常运行
在关闭/ body标记之前定义脚本标记
//Javascript
function overlaycontactopen() {
document.getElementById("myNav").style.height = "100%";
}
function overlaycontactclose() {
document.getElementById("myNav").style.height = "0%";
}
function onSubmit(token) {
document.getElementById("formular").submit();
}
function openNav() {
document.getElementById("mySidenav").style.width = "250px";
document.body.style.backgroundColor = "rgba(0,0,0,0.4)";
}
function closeNav() {
document.getElementById("mySidenav").style.width = "0";
document.body.style.backgroundColor = "white";
}
function initMap() {
var uluru = {
lat: 44,
lng: 44
};
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 10,
center: uluru
});
var marker = new google.maps.Marker({
position: uluru,
map: map
});
google.maps.event.addDomListener(window, 'resize', function() {
map.setCenter(uluru);
});
}
// JQUERY
$(document).ready(function () {
$.fn.rotate = function (degrees) {
return $(this).css({
'transform': 'rotate(' + degrees + 'deg)'
});
};
$('.strijela').click(function() {
var rotation = $(this).find("i").data('rotation') || 0;
rotation += 180;
$(this).children("i").rotate(rotation).data('rotation', rotation);
$(this).next(".ekstenzijapanel").slideToggle("slow");
});
//MATERIALIZE STUFF
$(".owl-carousel").owlCarousel({
loop:true,
autoplay: true,
autoplayTimeout: 3000,
autoplayHoverPause:false,
items: 1,
autoHeight: true,
autoHeightClass: 'owl-height'
});
$('ul.tabs').tabs();
$('.parallax').parallax();
$('.materialboxed').materialbox();
$('.modal').modal();
$('.slider').slider({
height: 689,
indicators: false,
});
});