拆分JS代码

时间:2018-02-02 13:33:45

标签: javascript jquery performance optimization materialize

我有插件初始化的问题。一切正常,除了物化的少量插件 - 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,
    });
});

0 个答案:

没有答案