<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Горизонтальная прокрутка колесиком мыши</title>
<style>
/* .wrapper::-webkit-scrollbar {
display: none;
} */
.wrapper {
width: 100%;
white-space: nowrap;
overflow-x: auto;
}
.item {
display: inline-block;
width: 200px;
height: 200px;
margin-right: 10px;
background-color: #f0f0f0;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
<script>
document.addEventListener("DOMContentLoaded", function() {
const wrapper = document.querySelector(".wrapper");
wrapper.addEventListener("wheel", (event) => {
if (event.deltaY !== 0) {
wrapper.scrollLeft += event.deltaY;
event.preventDefault();
}
});
});
</script>
</body>
</html>
$(document).ready(function() {
// Когда документ полностью загружен и готов к работе...
$(".ajax_add_to_cart").on("click", function() {
// При клике на элемент с классом "ajax_add_to_cart"...
var productImage = $(this).closest(".post").find("img");
// Находим ближайший родительский элемент с классом "post" и внутри него ищем изображение (тег <img>)
productImage
.clone() // Клонируем изображение товара
.css({
position: "absolute", // Позиционируем клон абсолютно на странице
"z-index": "11100", // Устанавливаем высокий порядок слоя для клонированного изображения
top: productImage.offset().top, // Устанавливаем верхнюю позицию клонированного изображения
left: productImage.offset().left // Устанавливаем левую позицию клонированного изображения
})
.appendTo("body") // Добавляем клонированное изображение внутрь элемента body страницы
.animate({
opacity: 0.05, // Задаем конечную прозрачность для анимации
left: $("#cart-punkt").offset().left, // Устанавливаем конечную левую позицию для анимации
top: $("#cart-punkt").offset().top, // Устанавливаем конечную верхнюю позицию для анимации
width: 20 // Устанавливаем конечную ширину для анимации
}, 1000, function() {
// По завершении анимации...
$(this).remove(); // Удаляем клонированное изображение
});
});
});
## Общие CSS стили для админ-панели. Нужно создать файл 'wp-admin.css' в папке темы
add_action( 'admin_enqueue_scripts', function(){
wp_enqueue_style( 'my-wp-admin', get_template_directory_uri() .'css/wp-admin.css' );
}, 99 );
add_action( 'woocommerce_thankyou', 'custom_woocommerce_auto_complete_order' );
function custom_woocommerce_auto_complete_order( $order_id ) {
if ( ! $order_id ) {
return;
}
$order = wc_get_order( $order_id );
if( $order->has_status( 'processing' ) ) {
$order->update_status( 'completed' );
}
}