#jquery #wordpress #scrollable
#jquery #wordpress #прокручиваемый
Вопрос:
Мне очень сложно заставить это работать. Любая помощь будет вознаграждена выигрышной кармой в лотерее 🙂
Я установил ванильный сайт WP и отредактировал только один пост, а functions.php чтобы добавить CSS. Это демонстрирует проблему.
Ничего не работало, когда я добавил все объявления jquery / tools wp_register_script / wp_enqueue_script в functions.php так что ради здравомыслия и временно, они находятся в сообщении (я знаю, что это неправильное место).
Итак, это почти работает. Я не получаю ошибок, но страница (которая отлично работает без WP) не отображает содержимое панелей. Есть идеи? Глядя на консоль Chrome, все ресурсы загружены, все скрипты есть.
Спасибо за любую помощь. Вырываются волосы…
Комментарии:
1. почему бы вам не добавить CSS и jQuery includes в заголовок, противоположный файлу функций?
2. Я читал, что функции — это то, где должны быть все включения. Я на самом деле много чего перепробовал, это самая функциональная версия. Когда я смогу заставить его работать, я (медленно) помещу все это туда, куда оно должно идти.
Ответ №1:
Я считаю, что вам не следует добавлять код в functions.php файл, который не имеет прямого отношения к вашей конфигурации WordPress (например, пользовательские типы записей и функции для php).
Верните functions.php файл и любой дополнительный код, который вы добавили в свои файлы; затем попробуйте:
Найти header.php и между <head> </head> тегами включите следующий код:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<?php if ( is_singular() amp;amp; get_option( 'thread_comments' ) ) wp_enqueue_script( 'comment-reply' ); wp_head(); ?>
в качестве простого теста, чтобы увидеть, работает ли jQuery в заголовке;
<script type="text/javascript">
$(function(){
$(".scrollable").scrollable();
});
</script>
В заголовке добавьте следующее:
<style type="text/css">
/*
root element for the scrollable.
when scrolling occurs this element stays still.
*/
.scrollable {
/* required settings */
position:relative;
overflow:hidden;
width: 660px;
height:90px;
}
/*
root element for scrollable items. Must be absolutely positioned
and it should have a extremely large width to accommodate scrollable items.
it's enough that you set width and height for the root element and
not for this element.
*/
.scrollable .items {
/* this cannot be too large */
width:20000em;
position:absolute;
}
/*
a single item. must be floated in horizontal scrolling.
typically, this element is the one that *you* will style
the most.
*/
.items div {
float:left;
}
</style>
Комментарии:
1. Хорошо, итак, я добавил этот код в заголовок и вернул функции к ванили. jQuery работает нормально, но теперь я не нахожу возможности прокрутки в библиотеке jquery.tools. Я добавил
2. хорошо, смотрите Приведенный Выше ответ, попробуйте добавить это в свой заголовок сейчас, убедитесь, что html также отображается на домашней странице, но я считаю, что это уже так. Просто добавьте CSS и измените исходный скрипт, который вы добавили.
3. Добавлены ваши изменения, а также включен css из плагина jquery.tools. Теперь у нас та же проблема. Похоже, что все работает, за исключением того, что весь контент не отображается, хотя он присутствует, когда вы смотрите на DOM с помощью Chrome. Очень странно. Я могу буквально вырезать и вставить это в пустой HTML-документ, и он работает нормально. Должно быть много людей, использующих jquery.tools с WordPress.
4. таблица стилей css добавляет стили по умолчанию «display: none;» из того, который вы включили.
5. Таблица стилей является стандартной с сайта jquery tools. Вот почему я так смущен. Если я вырезаю и вставляю весь этот код на страницу, отличную от WP, все начинает работать, никаких проблем. Я могу понять, включены ли скрипты и стили в неправильном порядке, но это похоже на то, что что-то в WP отключает библиотеку или CSS. Я буду продолжать пытаться. Сегодняшний день превращается в марафон 🙂