Гугл ругается на JQuery
Добрый день!
Подскажите, пожалуйста, а то всю голову уже сломал:
сайт на MODX 2/6/5 — pl сейчас в head стоит вызов jquery
Подскажите, пожалуйста, а то всю голову уже сломал:
сайт на MODX 2/6/5 — pl сейчас в head стоит вызов jquery
<script src="[[++assets_url]]components/themebootstrap/js/jquery.min.js"></script>
при этом гугл говорит оптимизируйте этот файл, ставлю асинхронный вызов<script async src="[[++assets_url]]components/themebootstrap/js/jquery.min.js"></script>
гугл перестает ругаться, но съезжают строки в меню, пропадают картинки в каруселе. Подскажите что нужно сделать. Заранее благодарен. Комментарии: 10
Переместить вниз не пробовали?
Пробовал, даже менял на вызов с гугловского сайта
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
, история такая же, минут пять работает нормально а потом опять едет шрифт, и разметка.
Попробуйте defer, а вообще посмотрите, возможно из за асинхронной загрузки не работают другие скрипты, нужно поиграть, какому то поставить defer, а какому то async. По крайней мере у меня так всегда прокатывало.
Или используйте как вариант minifyx
Или используйте как вариант minifyx
Спасибо! minifyx стоит, пробовал async — ситуация та же, defer — не прокатывает вообще (сворачивает сайт до отображения в виде перечня ссылок). Попробую сегодня поиграть с вызовом через async другие скрипты.
Вообще если делать через minifyx, то ругаться перестаёт вообще. И ещё заметил одну странность, когда последние несколько раз использовал компонент, получалось что первая загрузка сайта нормально, но при последующих слетают стили. Не знаю с чем связано… Просто отказался от его использования.
во во, вот сидим и ломаем голову… сейчас попробуем вызвать как вы написали: «Попробуйте defer, а вообще посмотрите, возможно из за асинхронной загрузки не работают другие скрипты, нужно поиграть, какому то поставить defer, а какому то async.» как получится напишу.
Основные стили в head.
После открытия body jquery, причем советуют с серверов гугла ставить ссылку, т.к. у клиентов кешируется, я все равно ставлю со своего сервера.
В самый низ body остальные скрипты, стили js компонентов.
И будет на вашей улице счастье)
После открытия body jquery, причем советуют с серверов гугла ставить ссылку, т.к. у клиентов кешируется, я все равно ставлю со своего сервера.
В самый низ body остальные скрипты, стили js компонентов.
И будет на вашей улице счастье)
спасибо, js компоненты вызываются внизу страницы (footer), в head идет вызов css и jquery, пробовали и так и так работает только когда со своего сервера грузишь. пробовали опустить вниз вызов jquery — слетают стили, и дальше в меню, в body где идет карусель — в ней перестает подтягивать картинки. так что вот так…
так async отрубите, понятное дело что карусели спадают
так нет уже. Вот так выглядит head, который работает:
<meta charset="[[++modx_charset]]">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="[[*description]]"/>
<meta name="keywords" content="[[*seoKeywords]]" />
<meta name="author" content="">
<base href="[[++site_url]]" />
<title>[[*pagetitle]]</title>
<!-- You can add theme from bootswatch.com: just add it into &cssSources=``.
For example: [[++assets_url]]components/themebootstrap/css/slate/bootstrap.min.css-->
[[MinifyX?
&minifyCss=`1`
®isterCss=`1`
&cssSources=`
[[++assets_url]]components/themebootstrap/css/bootstrap.min.css,
[[++assets_url]]components/themebootstrap/css/add.css,
[[++assets_url]]components/themebootstrap/css/yamm.css,
[[++assets_url]]/components/fancybox/css/jquery.fancybox.min.css
`
]]
<script src="[[++assets_url]]components/themebootstrap/js/jquery.min.js"></script>
<script>
// YAMM MENU
$(document).on('click', '.yamm .dropdown-menu', function(e) { e.stopPropagation()})
</script>
<script>
$(document).ready(function() {
$('.level2 ul').removeClass("col-sm-3");
$('.level1').each(function() {
if(!$(this).find("ul").length)
$(this).addClass("col-sm-3");
});
});
$(document).on('click','.level2 > ul > a', function(e) {
e.preventDefault();
$(this).parent().find('div.menuhide').slideToggle();
});
</script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
а вот так footer:<footer>
<div class="row">
<div class="col-lg-3">
[[pdoMenu?
&startId=`269`
&level=`1`
&tplParentRow=`@INLINE <p>[[+pagetitle]]</p>`
]]</div>
<div class="col-lg-3">
[[pdoMenu?
&startId=`280`
&level=`1`
&tplInner=`@INLINE [[+pagetitle]]
`
&tplOuter=`@INLINE <p>[[+wrapper]]</p>`
]]</div>
<div class="col-lg-2">
<a href="http://www.facebook.com/groups/334645603588832/"><img src="assets/images/pages/facebook.png" class="img-responsive"&options=`h=15&w=15&zc=C`></a>
<a href="http://vk.com/naturecosmetic.saratov"><img src="assets/images/pages/vk_2.png" class="img-responsive"&options=`h=15&w=15&zc=C`></a>
</div>
<div class="col-lg-4">
©2017 [[++site_name]] – OOO "Компания Элетто"
</div>
[[$metrika]]
</div>
</footer>
<!-- You can add theme from bootswatch.com: just add it into &cssSources=``.
For example: [[++assets_url]]components/themebootstrap/css/slate/bootstrap.min.css-->
[[MinifyX?
&minifyJs=`1`
®isterJs=`1`
&jsSources=`
[[++assets_url]]components/themebootstrap/js/bootstrap.min.js,
[[++assets_url]]/components/fancybox/js/jquery.fancybox.min.js
`
]]
но на него ругается гугл, перепробовал уже все ничего не получается.
Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.