{"id":4515,"date":"2024-09-04T12:07:23","date_gmt":"2024-09-04T12:07:23","guid":{"rendered":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/?page_id=4515"},"modified":"2025-06-02T13:29:04","modified_gmt":"2025-06-02T13:29:04","slug":"advanced-slider","status":"publish","type":"page","link":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/advanced-slider\/","title":{"rendered":"Advanced Slider"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"4515\" class=\"elementor elementor-4515\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-573b999 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"573b999\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-d69c513\" data-id=\"d69c513\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-716397e elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"716397e\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-inner-column elementor-element elementor-element-fc605eb\" data-id=\"fc605eb\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-8b722a0 elementor-widget elementor-widget-heading\" data-id=\"8b722a0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Advanced Slider<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6b56e03 elementor-widget elementor-widget-text-editor\" data-id=\"6b56e03\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p dir=\"ltr\">A slider can make your website more engaging. It allows users to view multiple pieces of content without cluttering the page.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-inner-column elementor-element elementor-element-552ac7d\" data-id=\"552ac7d\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-f7931cd elementor-widget elementor-widget-elemento_advance_slider\" data-id=\"f7931cd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elemento_advance_slider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t    <!-- Wrapper start -->\n    <div class=\"advance-elementor-slider slider-f7931cd       arrow-show-hvr \" data-slides-to-show-desktop=\"\" data-slides-to-show-tablet=\"1\" data-slides-to-show-mobile=\"1  \">\n       \n                <div class=\"slick-slider\">\n                                <div class=\"slick-slides  slide-703cc49\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-18.jpg\" alt=\"Buy Shoes\">                                        <div class=\"overlay\" style=\"background:#00000045; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#00000030\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Buy Shoes                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Investing in good shoes often means better materials. Higher quality shoes tend to last longer, saving you money in the long run.                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Shop Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-2c0b691\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-19.jpg\" alt=\"Buy Jeans\">                                        <div class=\"overlay\" style=\"background:#00000045; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#00000030\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Buy Jeans                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Lorem ipsum dolor sit amet consectetur adipiscing elit sociis, inceptos nulla magnis placerat risus dignissim bibendum, ligula                             <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Shop Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-bcb4152\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-20.jpg\" alt=\"Jackets\">                                        <div class=\"overlay\" style=\"background:#00000045; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#00000030\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Jackets                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Lorem ipsum dolor sit amet consectetur adipiscing elit sociis, inceptos nulla magnis placerat risus dignissim bibendum, ligula                             <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Shop Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                            <\/div>\n            <\/div>\n    <script>\n        jQuery(document).ready(function($) {\n            $('.advance-elementor-slider.slider-f7931cd .slick-slider').slick({\n\n                                    slidesToShow:1,\n                \n                \n                slidesToScroll:1,\n        \n                pauseOnHover:true,\n                autoplaySpeed:2000,\n                infinite:false,\n                cssEase: 'ease',\n                speed:5000,\n                adaptiveHeight: true,\n                responsive: [\n                    {\n                        breakpoint: 1024,\n                        settings: {\n                            slidesToShow: 1,\n                                                       }\n                    },\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 1,\n                                                    }\n                    }\n                ],\n                \n                                prevArrow: false,\n                nextArrow: false,\n                arrows: false,\n            \n                            dots: true,\n            \n                            autoplay: true,\n            \n                            fade:false,\n            \n                            rtl:false,\n            \n                            vertical:false,\n            \n            });\n            \n            $('.advance-elementor-slider.slider-f7931cd .slick-slider').on('afterChange', function(event, slick, currentSlide) {\n            \/\/ Get the current slide content\n            var $currentSlideContent = $(slick.$slides[currentSlide]).find('.slider-content');\n            var animationClass = $currentSlideContent.data('animation');\n            \/\/ Remove animation classes from all slides\n            $('.advance-elementor-slider.slider-f7931cd .slider-content').removeClass('animate-up animate-down animate-right animate-left animate-zoom');\n\n            \/\/ Add the animation class to the current slide content\n            \n            if (animationClass) {\n                $currentSlideContent.addClass(animationClass);\n            }\n\n            });\n\n            $(window).on('resize orientationchange', function() {\n                $('.advance-elementor-slider.slider-f7931cd .slick-slider').slick('setPosition');\n            });\n        });\n\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-5ec11f8 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"5ec11f8\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-aac9387\" data-id=\"aac9387\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-8ca052f elementor-widget elementor-widget-heading\" data-id=\"8ca052f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Showcase Whatever You Want!<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2abd9e1 elementor-widget elementor-widget-text-editor\" data-id=\"2abd9e1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-331ee28 premium-header-block elementor-widget__width-initial elementor-widget elementor-widget-premium-addon-dual-header\" data-id=\"331ee28\" data-element_type=\"widget\" data-widget_type=\"premium-addon-dual-header.default\"><div class=\"elementor-widget-container\"><p class=\"premium-dual-header-first-header \"><span style=\"font-size: 16px\">\u00a0Elevate your website\u2019s appeal and engage your audience with our innovative widget that seamlessly combines<br \/>creativity with cutting-edge design.<\/span><\/p><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-74597fa elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"74597fa\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-inner-column elementor-element elementor-element-62c5127\" data-id=\"62c5127\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-22ada5d elementor-widget elementor-widget-elemento_advance_slider\" data-id=\"22ada5d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elemento_advance_slider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t    <!-- Wrapper start -->\n    <div class=\"advance-elementor-slider slider-22ada5d   slide-center-mode    arrow-show-hvr \" data-slides-to-show-desktop=\"3\" data-slides-to-show-tablet=\"1\" data-slides-to-show-mobile=\"1  \">\n       \n                <div class=\"slick-slider\">\n                                <div class=\"slick-slides  slide-df85292\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/esty07.png\" alt=\"Ear Ring\">                                        <div class=\"overlay\" style=\"background:#FFFFFF52; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                            <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"\">\n                        <div class=\"slide-caption-inner\" style=\"\">\n                                                    <div class=\"slide-title\" style=\"\">\n                                Ear Ring                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"\">\n                                $45                            <\/p>\n                                                                                                        <a style=\"\" class=\"slide-button\" href=\"\">Buy Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-11b131f\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/esty06.png\" alt=\"Ring\">                                        <div class=\"overlay\" style=\"background:#FFFFFF52; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                            <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"\">\n                        <div class=\"slide-caption-inner\" style=\"\">\n                                                    <div class=\"slide-title\" style=\"\">\n                                Ring                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"\">\n                                $51                            <\/p>\n                                                                                                        <a style=\"\" class=\"slide-button\" href=\"\">Buy Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-09c3ce5\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/esty05.png\" alt=\"Bracelet\">                                        <div class=\"overlay\" style=\"background:#FFFFFF52; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                            <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"\">\n                        <div class=\"slide-caption-inner\" style=\"\">\n                                                    <div class=\"slide-title\" style=\"\">\n                                Bracelet                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"\">\n                                $35                            <\/p>\n                                                                                                        <a style=\"\" class=\"slide-button\" href=\"\">Buy Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-baf5d34\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/esty04.png\" alt=\"Pandants\">                                        <div class=\"overlay\" style=\"background:#FFFFFF52; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                            <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"\">\n                        <div class=\"slide-caption-inner\" style=\"\">\n                                                    <div class=\"slide-title\" style=\"\">\n                                Pandants                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"\">\n                                $79                            <\/p>\n                                                                                                        <a style=\"\" class=\"slide-button\" href=\"\">Buy Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-7d84719\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/esty03.png\" alt=\"Ear Rings\">                                        <div class=\"overlay\" style=\"background:#FFFFFF52; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                            <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"\">\n                        <div class=\"slide-caption-inner\" style=\"\">\n                                                    <div class=\"slide-title\" style=\"\">\n                                Ear Rings                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"\">\n                                $59                            <\/p>\n                                                                                                        <a style=\"\" class=\"slide-button\" href=\"\">Buy Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                            <\/div>\n            <\/div>\n    <script>\n        jQuery(document).ready(function($) {\n            $('.advance-elementor-slider.slider-22ada5d .slick-slider').slick({\n\n                                    slidesToShow:3,\n                \n                                centerMode: true,\n                centerPadding: 'px',\n                \n                slidesToScroll:1,\n        \n                pauseOnHover:false,\n                autoplaySpeed:500,\n                infinite:true,\n                cssEase: 'ease-out',\n                speed:2000,\n                adaptiveHeight: true,\n                responsive: [\n                    {\n                        breakpoint: 1024,\n                        settings: {\n                            slidesToShow: 1,\n                                                               centerMode: true,\n                                centerPadding: '40px',\n                                                        }\n                    },\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 1,\n                                                            centerMode: true,\n                                centerPadding: '40px',\n                                                        }\n                    }\n                ],\n                \n                                prevArrow: '<div class=\"slick-prev\"><i aria-hidden=\"true\" class=\"fa fa-chevron-left\"><\/i><\/div>',\n                nextArrow: '<div class=\"slick-next\"><i aria-hidden=\"true\" class=\"fa fa-chevron-right\"><\/i><\/div>',\n                arrows: true,\n            \n                            dots: true,\n            \n                            autoplay:false,\n            \n                            fade:false,\n            \n                            rtl:false,\n            \n                            vertical:false,\n            \n            });\n            \n            $('.advance-elementor-slider.slider-22ada5d .slick-slider').on('afterChange', function(event, slick, currentSlide) {\n            \/\/ Get the current slide content\n            var $currentSlideContent = $(slick.$slides[currentSlide]).find('.slider-content');\n            var animationClass = $currentSlideContent.data('animation');\n            \/\/ Remove animation classes from all slides\n            $('.advance-elementor-slider.slider-22ada5d .slider-content').removeClass('animate-up animate-down animate-right animate-left animate-zoom');\n\n            \/\/ Add the animation class to the current slide content\n            \n            if (animationClass) {\n                $currentSlideContent.addClass(animationClass);\n            }\n\n            });\n\n            $(window).on('resize orientationchange', function() {\n                $('.advance-elementor-slider.slider-22ada5d .slick-slider').slick('setPosition');\n            });\n        });\n\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-b885383 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"b885383\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-0619b26\" data-id=\"0619b26\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-6a8c5dd elementor-widget elementor-widget-heading\" data-id=\"6a8c5dd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Custom Style Slider<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c688513 elementor-widget elementor-widget-text-editor\" data-id=\"c688513\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p dir=\"ltr\">Custom sliders can showcase different types of content. You can highlight images, videos, or testimonials,<br \/>making your site more dynamic and informative.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-56b69d2 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"56b69d2\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-inner-column elementor-element elementor-element-517c2bc\" data-id=\"517c2bc\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-1fbe73b elementor-widget elementor-widget-elemento_advance_slider\" data-id=\"1fbe73b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elemento_advance_slider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t    <!-- Wrapper start -->\n    <div class=\"advance-elementor-slider slider-1fbe73b       arrow-show-hvr \" data-slides-to-show-desktop=\"\" data-slides-to-show-tablet=\"1\" data-slides-to-show-mobile=\"1  \">\n       \n                <div class=\"slick-slider\">\n                                <div class=\"slick-slides  slide-2ec941f\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-21.jpg\" alt=\"Buy Shoes\">                                        <div class=\"overlay\" style=\"background:#00000000; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"justify-content: flex-start; align-items: flex-start; text-align: left;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#00000030\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Buy Shoes                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Investing in good shoes often means better materials. Higher quality shoes tend to last longer, saving you money in the long run.                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Shop Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-703cc49\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-22.jpg\" alt=\"Casual Sandals\">                                        <div class=\"overlay\" style=\"background:#0000001C; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"justify-content: flex-start; align-items: flex-start; text-align: left;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#FFFFFFC2\">\n                                                    <div class=\"slide-title\" style=\"color:#000000\">\n                                Casual Sandals                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#000000\">\n                                We bring you this footwear in new designs. From beach-ready women&#039;s gladiators to party-wear heel sandals                            <\/p>\n                                                                                                        <a style=\"border-color:#000000;color:#000000\" class=\"slide-button\" href=\"\">Shop Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                            <\/div>\n            <\/div>\n    <script>\n        jQuery(document).ready(function($) {\n            $('.advance-elementor-slider.slider-1fbe73b .slick-slider').slick({\n\n                                    slidesToShow:1,\n                \n                \n                slidesToScroll:1,\n        \n                pauseOnHover:true,\n                autoplaySpeed:2000,\n                infinite:true,\n                cssEase: 'ease',\n                speed:5000,\n                adaptiveHeight: true,\n                responsive: [\n                    {\n                        breakpoint: 1024,\n                        settings: {\n                            slidesToShow: 1,\n                                                       }\n                    },\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 1,\n                                                    }\n                    }\n                ],\n                \n                                prevArrow: false,\n                nextArrow: false,\n                arrows: false,\n            \n                            dots: true,\n            \n                            autoplay:false,\n            \n                            fade:true,\n            \n                            rtl:false,\n            \n                            vertical:false,\n            \n            });\n            \n            $('.advance-elementor-slider.slider-1fbe73b .slick-slider').on('afterChange', function(event, slick, currentSlide) {\n            \/\/ Get the current slide content\n            var $currentSlideContent = $(slick.$slides[currentSlide]).find('.slider-content');\n            var animationClass = $currentSlideContent.data('animation');\n            \/\/ Remove animation classes from all slides\n            $('.advance-elementor-slider.slider-1fbe73b .slider-content').removeClass('animate-up animate-down animate-right animate-left animate-zoom');\n\n            \/\/ Add the animation class to the current slide content\n            \n            if (animationClass) {\n                $currentSlideContent.addClass(animationClass);\n            }\n\n            });\n\n            $(window).on('resize orientationchange', function() {\n                $('.advance-elementor-slider.slider-1fbe73b .slick-slider').slick('setPosition');\n            });\n        });\n\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-1ad6cc5 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"1ad6cc5\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-4ba470f\" data-id=\"4ba470f\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-9731458 elementor-widget elementor-widget-heading\" data-id=\"9731458\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Slider Orientations<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-07e16fb elementor-widget elementor-widget-text-editor\" data-id=\"07e16fb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p dir=\"ltr\">Slider orientations refer to the positioning and movement of sliding elements or controls within a user interface.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-a1953e6 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"a1953e6\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-inner-column elementor-element elementor-element-ac857c1\" data-id=\"ac857c1\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5d88832 elementor-widget elementor-widget-heading\" data-id=\"5d88832\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Vertical Slider <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-53f25a0 elementor-widget elementor-widget-elemento_advance_slider\" data-id=\"53f25a0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elemento_advance_slider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t    <!-- Wrapper start -->\n    <div class=\"advance-elementor-slider slider-53f25a0        \" data-slides-to-show-desktop=\"\" data-slides-to-show-tablet=\"1\" data-slides-to-show-mobile=\"1  \">\n       \n                <div class=\"slick-slider\">\n                                <div class=\"slick-slides  slide-99f1d4b\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-25.jpg\" alt=\"Handbag\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content \"  data-animation=\"\" style=\"justify-content: ; align-items: ; text-align: ;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#A26868AB\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Handbag                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Handbag deals are a highly sought-after commodity in the world of fashion and style.                             <\/p>\n                                                                        <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-335931c\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-23.jpg\" alt=\"Men&#039;s Shirts\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                            <div class=\"slide-caption  slider-content \"  data-animation=\"\" style=\"justify-content: ; align-items: ; text-align: ;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#A26868AB\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Men&#039;s Shirts                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Exclusive deals on men&#039;s shirts are a highly sought-after opportunity for fashion-conscious gentlemen                            <\/p>\n                                                                        <\/div>\n                        <\/div>\n                    <\/div>\n                            <\/div>\n            <\/div>\n    <script>\n        jQuery(document).ready(function($) {\n            $('.advance-elementor-slider.slider-53f25a0 .slick-slider').slick({\n\n                                    slidesToShow:1,\n                \n                \n                slidesToScroll:1,\n        \n                pauseOnHover:true,\n                autoplaySpeed:500,\n                infinite:true,\n                cssEase: 'linear',\n                speed:2000,\n                adaptiveHeight: true,\n                responsive: [\n                    {\n                        breakpoint: 1024,\n                        settings: {\n                            slidesToShow: 1,\n                                                       }\n                    },\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 1,\n                                                    }\n                    }\n                ],\n                \n                                prevArrow: '<div class=\"slick-prev\"><i aria-hidden=\"true\" class=\"fa fa-chevron-left\"><\/i><\/div>',\n                nextArrow: '<div class=\"slick-next\"><i aria-hidden=\"true\" class=\"fa fa-chevron-right\"><\/i><\/div>',\n                arrows: true,\n            \n                            dots: false,\n            \n                            autoplay:false,\n            \n                            fade:false,\n            \n                            rtl:false,\n            \n                            vertical:true,\n            \n            });\n            \n            $('.advance-elementor-slider.slider-53f25a0 .slick-slider').on('afterChange', function(event, slick, currentSlide) {\n            \/\/ Get the current slide content\n            var $currentSlideContent = $(slick.$slides[currentSlide]).find('.slider-content');\n            var animationClass = $currentSlideContent.data('animation');\n            \/\/ Remove animation classes from all slides\n            $('.advance-elementor-slider.slider-53f25a0 .slider-content').removeClass('animate-up animate-down animate-right animate-left animate-zoom');\n\n            \/\/ Add the animation class to the current slide content\n            \n            if (animationClass) {\n                $currentSlideContent.addClass(animationClass);\n            }\n\n            });\n\n            $(window).on('resize orientationchange', function() {\n                $('.advance-elementor-slider.slider-53f25a0 .slick-slider').slick('setPosition');\n            });\n        });\n\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-inner-column elementor-element elementor-element-7b5df71\" data-id=\"7b5df71\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-7132ffb elementor-widget elementor-widget-heading\" data-id=\"7132ffb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Horizontal Slider <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c0cbc33 elementor-widget elementor-widget-elemento_advance_slider\" data-id=\"c0cbc33\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elemento_advance_slider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t    <!-- Wrapper start -->\n    <div class=\"advance-elementor-slider slider-c0cbc33       arrow-show-hvr \" data-slides-to-show-desktop=\"\" data-slides-to-show-tablet=\"1\" data-slides-to-show-mobile=\"1  \">\n       \n                <div class=\"slick-slider\">\n                                <div class=\"slick-slides  slide-703cc49\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-27-1.jpg\" alt=\"Casual Shoes\">                                        <div class=\"overlay\" style=\"background:#00000045; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"justify-content: flex-start; align-items: flex-start; text-align: left;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#00000030\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Casual Shoes                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Investing in good shoes often means better materials. Higher quality shoes tend to last longer                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Shop Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-2ec941f\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-26-1.jpg\" alt=\"Western dress\">                                        <div class=\"overlay\" style=\"background:#00000045; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"justify-content: flex-start; align-items: flex-start; text-align: left;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#00000030\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Western dress                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Find the perfect Western dresses at our store. Buy from the collection of Latest Indo Western Dresses                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Shop Now<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                            <\/div>\n            <\/div>\n    <script>\n        jQuery(document).ready(function($) {\n            $('.advance-elementor-slider.slider-c0cbc33 .slick-slider').slick({\n\n                                    slidesToShow:1,\n                \n                \n                slidesToScroll:1,\n        \n                pauseOnHover:true,\n                autoplaySpeed:2000,\n                infinite:true,\n                cssEase: 'ease',\n                speed:5000,\n                adaptiveHeight: true,\n                responsive: [\n                    {\n                        breakpoint: 1024,\n                        settings: {\n                            slidesToShow: 1,\n                                                       }\n                    },\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 1,\n                                                    }\n                    }\n                ],\n                \n                                prevArrow: '<div class=\"slick-prev\"><i aria-hidden=\"true\" class=\"fa fa-chevron-left\"><\/i><\/div>',\n                nextArrow: '<div class=\"slick-next\"><i aria-hidden=\"true\" class=\"fa fa-chevron-right\"><\/i><\/div>',\n                arrows: true,\n            \n                            dots: true,\n            \n                            autoplay:false,\n            \n                            fade:true,\n            \n                            rtl:false,\n            \n                            vertical:false,\n            \n            });\n            \n            $('.advance-elementor-slider.slider-c0cbc33 .slick-slider').on('afterChange', function(event, slick, currentSlide) {\n            \/\/ Get the current slide content\n            var $currentSlideContent = $(slick.$slides[currentSlide]).find('.slider-content');\n            var animationClass = $currentSlideContent.data('animation');\n            \/\/ Remove animation classes from all slides\n            $('.advance-elementor-slider.slider-c0cbc33 .slider-content').removeClass('animate-up animate-down animate-right animate-left animate-zoom');\n\n            \/\/ Add the animation class to the current slide content\n            \n            if (animationClass) {\n                $currentSlideContent.addClass(animationClass);\n            }\n\n            });\n\n            $(window).on('resize orientationchange', function() {\n                $('.advance-elementor-slider.slider-c0cbc33 .slick-slider').slick('setPosition');\n            });\n        });\n\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-7e02304 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"7e02304\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-65206f0\" data-id=\"65206f0\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-351a16d elementor-widget elementor-widget-heading\" data-id=\"351a16d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Slider Animations<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-188aad3 elementor-widget elementor-widget-text-editor\" data-id=\"188aad3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p dir=\"ltr\">These animations involve a series of images, graphics, or content blocks that smoothly transition from one to the next, <br \/>creating a captivating and visually engaging experience for the user.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-f1b0661 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"f1b0661\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-inner-column elementor-element elementor-element-6f1e155\" data-id=\"6f1e155\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-d8f2fdd elementor-widget elementor-widget-elemento_advance_slider\" data-id=\"d8f2fdd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elemento_advance_slider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t    <!-- Wrapper start -->\n    <div class=\"advance-elementor-slider slider-d8f2fdd       arrow-show-hvr \" data-slides-to-show-desktop=\"\" data-slides-to-show-tablet=\"1\" data-slides-to-show-mobile=\"1  \">\n       \n                <div class=\"slick-slider\">\n                                <div class=\"slick-slides  slide-bfd78b1\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-24.jpg\" alt=\"Slide With Animation\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#000000\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Slide With Animation                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Effect - Linear, Animation - Zoom                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Know More<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-17f957b\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-28.jpg\" alt=\"Slide With Animation\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-zoom\"  data-animation=\"animate-zoom\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#000000\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Slide With Animation                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Effect - Linear, Animation - Zoom                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Know More<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                            <\/div>\n            <\/div>\n    <script>\n        jQuery(document).ready(function($) {\n            $('.advance-elementor-slider.slider-d8f2fdd .slick-slider').slick({\n\n                                    slidesToShow:1,\n                \n                \n                slidesToScroll:1,\n        \n                pauseOnHover:true,\n                autoplaySpeed:500,\n                infinite:true,\n                cssEase: 'linear',\n                speed:2000,\n                adaptiveHeight: true,\n                responsive: [\n                    {\n                        breakpoint: 1024,\n                        settings: {\n                            slidesToShow: 1,\n                                                       }\n                    },\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 1,\n                                                    }\n                    }\n                ],\n                \n                                prevArrow: '<div class=\"slick-prev\"><i aria-hidden=\"true\" class=\"fa fa-chevron-left\"><\/i><\/div>',\n                nextArrow: '<div class=\"slick-next\"><i aria-hidden=\"true\" class=\"fa fa-chevron-right\"><\/i><\/div>',\n                arrows: true,\n            \n                            dots: true,\n            \n                            autoplay:false,\n            \n                            fade:false,\n            \n                            rtl:false,\n            \n                            vertical:false,\n            \n            });\n            \n            $('.advance-elementor-slider.slider-d8f2fdd .slick-slider').on('afterChange', function(event, slick, currentSlide) {\n            \/\/ Get the current slide content\n            var $currentSlideContent = $(slick.$slides[currentSlide]).find('.slider-content');\n            var animationClass = $currentSlideContent.data('animation');\n            \/\/ Remove animation classes from all slides\n            $('.advance-elementor-slider.slider-d8f2fdd .slider-content').removeClass('animate-up animate-down animate-right animate-left animate-zoom');\n\n            \/\/ Add the animation class to the current slide content\n            \n            if (animationClass) {\n                $currentSlideContent.addClass(animationClass);\n            }\n\n            });\n\n            $(window).on('resize orientationchange', function() {\n                $('.advance-elementor-slider.slider-d8f2fdd .slick-slider').slick('setPosition');\n            });\n        });\n\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-inner-column elementor-element elementor-element-e0f101f\" data-id=\"e0f101f\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-91c0388 elementor-widget elementor-widget-elemento_advance_slider\" data-id=\"91c0388\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elemento_advance_slider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t    <!-- Wrapper start -->\n    <div class=\"advance-elementor-slider slider-91c0388       arrow-show-hvr \" data-slides-to-show-desktop=\"\" data-slides-to-show-tablet=\"1\" data-slides-to-show-mobile=\"1  \">\n       \n                <div class=\"slick-slider\">\n                                <div class=\"slick-slides  slide-17f957b\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-29.jpg\" alt=\"Slide With Animation\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-up\"  data-animation=\"animate-up\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#000000\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Slide With Animation                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Effect - Ease, Animation - Up                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Know More<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-bfd78b1\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-30.jpg\" alt=\"Slide With Animation\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-up\"  data-animation=\"animate-up\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#000000\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Slide With Animation                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Effect - Ease, Animation - Up                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Know More<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                            <\/div>\n            <\/div>\n    <script>\n        jQuery(document).ready(function($) {\n            $('.advance-elementor-slider.slider-91c0388 .slick-slider').slick({\n\n                                    slidesToShow:1,\n                \n                \n                slidesToScroll:1,\n        \n                pauseOnHover:true,\n                autoplaySpeed:500,\n                infinite:true,\n                cssEase: 'ease',\n                speed:2000,\n                adaptiveHeight: true,\n                responsive: [\n                    {\n                        breakpoint: 1024,\n                        settings: {\n                            slidesToShow: 1,\n                                                       }\n                    },\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 1,\n                                                    }\n                    }\n                ],\n                \n                                prevArrow: false,\n                nextArrow: false,\n                arrows: false,\n            \n                            dots: false,\n            \n                            autoplay:false,\n            \n                            fade:false,\n            \n                            rtl:false,\n            \n                            vertical:false,\n            \n            });\n            \n            $('.advance-elementor-slider.slider-91c0388 .slick-slider').on('afterChange', function(event, slick, currentSlide) {\n            \/\/ Get the current slide content\n            var $currentSlideContent = $(slick.$slides[currentSlide]).find('.slider-content');\n            var animationClass = $currentSlideContent.data('animation');\n            \/\/ Remove animation classes from all slides\n            $('.advance-elementor-slider.slider-91c0388 .slider-content').removeClass('animate-up animate-down animate-right animate-left animate-zoom');\n\n            \/\/ Add the animation class to the current slide content\n            \n            if (animationClass) {\n                $currentSlideContent.addClass(animationClass);\n            }\n\n            });\n\n            $(window).on('resize orientationchange', function() {\n                $('.advance-elementor-slider.slider-91c0388 .slick-slider').slick('setPosition');\n            });\n        });\n\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-89ac217 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"89ac217\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-inner-column elementor-element elementor-element-80e6534\" data-id=\"80e6534\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-587412a elementor-widget elementor-widget-elemento_advance_slider\" data-id=\"587412a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elemento_advance_slider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t    <!-- Wrapper start -->\n    <div class=\"advance-elementor-slider slider-587412a       arrow-show-hvr \" data-slides-to-show-desktop=\"\" data-slides-to-show-tablet=\"1\" data-slides-to-show-mobile=\"1  \">\n       \n                <div class=\"slick-slider\">\n                                <div class=\"slick-slides  slide-17f957b\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-31.jpg\" alt=\"Slide With Animation\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-down\"  data-animation=\"animate-down\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#000000\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Slide With Animation                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Effect - Ease In , Animation - Down                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Know More<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-bfd78b1\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-34.jpg\" alt=\"Slide With Animation\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-down\"  data-animation=\"animate-down\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#000000\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Slide With Animation                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Effect - Ease In, Animation - Down                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Know More<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                            <\/div>\n            <\/div>\n    <script>\n        jQuery(document).ready(function($) {\n            $('.advance-elementor-slider.slider-587412a .slick-slider').slick({\n\n                                    slidesToShow:1,\n                \n                \n                slidesToScroll:1,\n        \n                pauseOnHover:true,\n                autoplaySpeed:500,\n                infinite:true,\n                cssEase: 'ease-in',\n                speed:2000,\n                adaptiveHeight: true,\n                responsive: [\n                    {\n                        breakpoint: 1024,\n                        settings: {\n                            slidesToShow: 1,\n                                                       }\n                    },\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 1,\n                                                    }\n                    }\n                ],\n                \n                                prevArrow: '<div class=\"slick-prev\"><i aria-hidden=\"true\" class=\"fa fa-chevron-left\"><\/i><\/div>',\n                nextArrow: '<div class=\"slick-next\"><i aria-hidden=\"true\" class=\"fa fa-chevron-right\"><\/i><\/div>',\n                arrows: true,\n            \n                            dots: true,\n            \n                            autoplay:false,\n            \n                            fade:false,\n            \n                            rtl:false,\n            \n                            vertical:false,\n            \n            });\n            \n            $('.advance-elementor-slider.slider-587412a .slick-slider').on('afterChange', function(event, slick, currentSlide) {\n            \/\/ Get the current slide content\n            var $currentSlideContent = $(slick.$slides[currentSlide]).find('.slider-content');\n            var animationClass = $currentSlideContent.data('animation');\n            \/\/ Remove animation classes from all slides\n            $('.advance-elementor-slider.slider-587412a .slider-content').removeClass('animate-up animate-down animate-right animate-left animate-zoom');\n\n            \/\/ Add the animation class to the current slide content\n            \n            if (animationClass) {\n                $currentSlideContent.addClass(animationClass);\n            }\n\n            });\n\n            $(window).on('resize orientationchange', function() {\n                $('.advance-elementor-slider.slider-587412a .slick-slider').slick('setPosition');\n            });\n        });\n\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-inner-column elementor-element elementor-element-64789f7\" data-id=\"64789f7\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-db57a7c elementor-widget elementor-widget-elemento_advance_slider\" data-id=\"db57a7c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elemento_advance_slider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t    <!-- Wrapper start -->\n    <div class=\"advance-elementor-slider slider-db57a7c       arrow-show-hvr \" data-slides-to-show-desktop=\"\" data-slides-to-show-tablet=\"1\" data-slides-to-show-mobile=\"1  \">\n       \n                <div class=\"slick-slider\">\n                                <div class=\"slick-slides  slide-17f957b\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-33.jpg\" alt=\"Slide With Animation\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-right\"  data-animation=\"animate-right\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#000000\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Slide With Animation                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Effect - Ease-Out, Animation - Right                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Know More<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                                <div class=\"slick-slides  slide-bfd78b1\"  >\n                                    <figure class=\"slide-image\">\n                    <img decoding=\"async\" src=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-content\/uploads\/sites\/72\/2024\/09\/image-32.jpg\" alt=\"Slide With Animation\">                                        <div class=\"overlay\" style=\"background:; position: absolute; top: 0; left: 0; right: 0; bottom: 0;\"><\/div>\n                                        <\/figure>\n                                                                                <div class=\"slide-caption  slider-content animate-right\"  data-animation=\"animate-right\" style=\"justify-content: center; align-items: center; text-align: center;\">\n                        <div class=\"slide-caption-inner\" style=\"background:#000000\">\n                                                    <div class=\"slide-title\" style=\"color:#fff\">\n                                Slide With Animation                            <\/div>\n                        \n                                                    <p class=\"slide-desc\" style=\"color:#fff\">\n                                Effect - Ease-Out, Animation - Right                            <\/p>\n                                                                                                        <a style=\"border-color:#fff;color:#fff\" class=\"slide-button\" href=\"\">Know More<\/a>\n                                                <\/div>\n                        <\/div>\n                    <\/div>\n                            <\/div>\n            <\/div>\n    <script>\n        jQuery(document).ready(function($) {\n            $('.advance-elementor-slider.slider-db57a7c .slick-slider').slick({\n\n                                    slidesToShow:1,\n                \n                \n                slidesToScroll:1,\n        \n                pauseOnHover:true,\n                autoplaySpeed:500,\n                infinite:true,\n                cssEase: 'ease-out',\n                speed:2000,\n                adaptiveHeight: true,\n                responsive: [\n                    {\n                        breakpoint: 1024,\n                        settings: {\n                            slidesToShow: 1,\n                                                       }\n                    },\n                    {\n                        breakpoint: 768,\n                        settings: {\n                            slidesToShow: 1,\n                                                    }\n                    }\n                ],\n                \n                                prevArrow: '<div class=\"slick-prev\"><i aria-hidden=\"true\" class=\"fa fa-chevron-left\"><\/i><\/div>',\n                nextArrow: '<div class=\"slick-next\"><i aria-hidden=\"true\" class=\"fa fa-chevron-right\"><\/i><\/div>',\n                arrows: true,\n            \n                            dots: true,\n            \n                            autoplay:false,\n            \n                            fade:false,\n            \n                            rtl:false,\n            \n                            vertical:false,\n            \n            });\n            \n            $('.advance-elementor-slider.slider-db57a7c .slick-slider').on('afterChange', function(event, slick, currentSlide) {\n            \/\/ Get the current slide content\n            var $currentSlideContent = $(slick.$slides[currentSlide]).find('.slider-content');\n            var animationClass = $currentSlideContent.data('animation');\n            \/\/ Remove animation classes from all slides\n            $('.advance-elementor-slider.slider-db57a7c .slider-content').removeClass('animate-up animate-down animate-right animate-left animate-zoom');\n\n            \/\/ Add the animation class to the current slide content\n            \n            if (animationClass) {\n                $currentSlideContent.addClass(animationClass);\n            }\n\n            });\n\n            $(window).on('resize orientationchange', function() {\n                $('.advance-elementor-slider.slider-db57a7c .slick-slider').slick('setPosition');\n            });\n        });\n\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Advanced Slider A slider can make your website more engaging. It allows users to view multiple pieces of content without cluttering the page. Buy Shoes Investing in good shoes often means better materials. Higher quality shoes tend to last longer, saving you money in the long run. Shop Now Buy Jeans Lorem ipsum dolor sit &hellip;<\/p>\n<p class=\"read-more\"> <a class=\" thunk-readmore button \" href=\"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/advanced-slider\/\"> <span class=\"screen-reader-text\">Advanced Slider<\/span>Read More<\/a><\/p>\n","protected":false},"author":175,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-4515","page","type-page","status-publish","hentry","thunk-woo-product-list","th-shop-mania-woo-hover-","open-single-product-tab-horizontal","open-shadow-","open-shadow-hover-"],"_links":{"self":[{"href":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-json\/wp\/v2\/pages\/4515","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-json\/wp\/v2\/users\/175"}],"replies":[{"embeddable":true,"href":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-json\/wp\/v2\/comments?post=4515"}],"version-history":[{"count":319,"href":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-json\/wp\/v2\/pages\/4515\/revisions"}],"predecessor-version":[{"id":7716,"href":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-json\/wp\/v2\/pages\/4515\/revisions\/7716"}],"wp:attachment":[{"href":"https:\/\/wpthemes.themehunk.com\/elite-addon-elementor\/wp-json\/wp\/v2\/media?parent=4515"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}