<html>
<head>
<base href="/">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" />
<link rel="stylesheet" href="includes/styles.css" />
<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.4/js/lightbox.min.js" integrity="sha512-Ixzuzfxv1EqafeQlTCufWfaC6ful6WFqIz4G+dWvK0beHw0NVJwvCKSgafpy5gwNqKmgUfIBraVwkKI+Cz0SEQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.4/css/lightbox.css" integrity="sha512-Woz+DqWYJ51bpVk5Fv0yES/edIMXjj3Ynda+KWTIkGoynAMHrqTcDUQltbipuiaD5ymEo9520lyoVOo9jCQOCA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@400;500;600;700&family=Readex+Pro:wght@400;500;600;700&display=swap" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="images/fav_icon.png">
<title> Canton Shopping Guide </title>
</head>
<body>
<style>
.page_active a {
color: red !important;
}
.home_user {
height: 100%;
display: flex;
align-items: center;
}
.profile_pic img {
width: 32px;
height: 32px;
border-radius: 50%;
margin-top: 18px;
}
.navbar {
padding:0 !important;
}
.top-bar {
padding: 10px;
text-align: center;
font-style: normal;
font-weight: 500;
line-height: normal;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
font-size: 15px !important;
}
.header-navbar {
padding: 15px 0;
}
.container-fluid {
max-width: 85%;
}
.nav_section {
margin-top: 0px;
padding: 11px 0px !important
}
.top_header {
background: rgba(255, 255, 255, 0.93);
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10);
z-index: 1;
position: relative;
}
.navbar-toggler{
display:none ;
}
.user_sidebar{
display:none;
}
.menu-toggle {
color: #FFF;
float: right;
line-height: 50px;
font-size: 24px;
cursor: pointer;
display: none;
}
.header1 {
display:none ;
}
@media only screen and (max-width:992px){
.container-fluid {
max-width: 100% !important;
}
#member_sidebar_toggle {
background-color: rgba(238, 238, 238,0.95);
color: #000;
border: none;
padding: 7px 10px;
border-radius: 6px;
}
#main_nav .nav-item {
max-width: 230px;
margin: auto;
}
.user_sidebar{
display:block;
}
.navbar-toggler {
text-align: right;
top: 47px;
right: 8px !important;
margin: 0 !important;
display:block !important;
}
.img_bg{
max-width:54% !important;
}
#main_nav{
width:100%;
}
#main_nav li a {
white-space: nowrap;
padding: 10px 0;
color: #222;
font-size: 17px !important;
font-style: normal;
font-weight: 600;
text-align:center;
margin: 0 !important;
}
}
#main_nav li a {
white-space: nowrap;
padding: 10px 0;
color: #222;
font-size: 17px;
font-style: normal;
font-weight: 600;
text-align:center;
margin: 0 !important;
}
.eapps-countdown-timer {
z-index: 0 !important;
}
#main_nav {
width: 100%;
padding: 0px !important;
justify-content: space-evenly;
}
.header1 {
max-width: 75%;
position: absolute;
z-index: 9999;
background: #fff;
top: 82px;
border-top: none;
height: calc(100vh - 80px);
overflow: auto;
}
.header1 .dash_sidebar {
border-top: 0 !important;
padding-bottom: 100px;
margin-bottom: 0 !important;
}
.opened {
display: block ;
}
.map_margin {
z-index: 0 !important;
}
#blog_slider {
z-index: 0;
}
@media only screen and (min-width:992px){
.nav_section {
margin-top: 0px;
padding: 11px 0px !important
}
.div_announcement marquee{
text-transform:initial;
}
.div_announcement {
width: 100%;
max-width: 70%;
}}
.rel_main_header {
position: sticky;
top: 0;
z-index: 999;
background: #ffff;
}
.nav_section .nav-item {
width: auto !important;
}
.marq {
margin-right: 400px;
margin-left: 400px;
}
@media only screen and (max-width:992px) {
.marq {
margin-right: 50px !important;
margin-left: 50px !important;
}
.marquee {
width: 100% !important;
}
}
.marquee {
width: 70%;
overflow: hidden;
white-space: nowrap;
position: relative;
height: 100%;
}
.text {
display: inline-block;
padding-right: 50px; /* Space between texts */
position: absolute;
visibility: hidden;
}
@media only screen and (min-width:992px) {
.text {
right: 35%;
left:0;
}
}
@media only screen and (max-width:992px) {
.text {
left:0;
}
}
</style>
<div class="rel_main_header">
<div class="top-bar" style="background:#1e5b9f;color:#ffffff;font-size: 17px;" >
<div class="marquee"><span class='text'>3 Crafty Sisters handmake jarred pickles, vegetables, salsa, bbq sauce, fruit preserves, syrup, honey and much more! Come see us in Trade Center 3!</span><span class='text'>Be sure to start your day at the Fire Grounds Coffee Shop located on Trade Days Blvd.! Our friendly baristas will brew our Gourmet Coffee just the way you like it!</span><span class='text'>Pop-A-Lot Gourmet Kettle Corn offers 30 flavors of fresh popped Kettle Corn in Pavilion 4000 and Pavilion 4500! </span><span class='text'>Aeramentum handcrafts custom jewelry using stone and crystals. Our designs are both beautiful and affordable! Come see our collection in Pavilion 2!</span><span class='text'>North Texas Knife Sharpening and Sales can professionally sharpen all your dull knives including pocket, hunting and kitchen knives. Come see us in Pavilion 4500!</span></div>
</div><script>
document.addEventListener('DOMContentLoaded', function() {
// Get the elements
const marquee = document.querySelector('.marquee');
const texts = Array.from(document.querySelectorAll('.text'));
// Function to start the marquee effect
function startMarquee(index) {
const text = texts[index];
const marqueeWidth = marquee.offsetWidth;
const textWidth = text.offsetWidth;
let currentPosition = marqueeWidth;
let isPaused = false;
// Make the current text visible and hide others
texts.forEach((txt, i) => {
txt.style.visibility = (i === index) ? 'visible' : 'hidden';
txt.style.transform = `translateX(${marqueeWidth}px)`; // Move to starting position off-screen
});
// Function to move the text
function moveText() {
if (!isPaused) {
currentPosition -= 1; // Adjust speed as needed
text.style.transform = `translateX(${currentPosition}px)`;
}
// Calculate if text has completely scrolled out of view
const isVisible = currentPosition + textWidth > 0 && currentPosition < marqueeWidth;
// If text is no longer visible, move to the next text
if (!isVisible) {
text.style.visibility = 'hidden';
// Move to the next text after a brief delay (e.g., 2 seconds)
setTimeout(() => {
const nextIndex = (index + 1) % texts.length;
startMarquee(nextIndex);
}, 1000); // Adjust delay as needed
return;
}
requestAnimationFrame(moveText);
}
// Pause scrolling when mouse enters the text
text.addEventListener('mouseenter', () => {
isPaused = true;
});
// Resume scrolling when mouse leaves the text
text.addEventListener('mouseleave', () => {
isPaused = false;
});
// Start moving the text
moveText();
}
// Start the marquee effect with the first text
startMarquee(0);
});
</script>
<div class="top_header">
<div class="container-fluid">
<div class="header-navbar">
<div class="row">
<div class="col-md-2 navbar-expand-lg " style="display: flex; align-items: center; justify-content: center;">
<a href="/home"><img style="width:100%;" class="img_bg" src="images/logo.webp" > </a>
<i class="fas fa-bars navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo03" aria-controls="navbarTogglerDemo03" aria-expanded="false" aria-label="Toggle navigation"></i>
</div>
<div class="col-md-10">
<div class="nav_section">
<nav class="navbar navbar-expand-lg">
<div class="collapse navbar-collapse" id="navbarTogglerDemo03" style="width:100%">
<ul class="navbar-nav " id="main_nav">
<li class="nav-item vendor_directory "><a class="nav-link main_link" href="search_results">Vendor Directory <span class="sr-only">(current)</span></a></li>
<li class="nav-item events "><a class="nav-link main_link" href="events">Events</a></li>
<li class="nav-item calendar "><a class="nav-link main_link" href="calender">Calender</a></li>
<li class="nav-item weather "><a class="nav-link main_link" href="weather">Weather</a></li>
<li class="nav-item dropdown canton_maps"><a class="nav-link dropdown-toggle" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">Maps</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="online-map" target="_blank">Online Map</a></li>
<li><a class="dropdown-item" href="printable-map">Printable Map</a></li>
</ul>
</li>
<li class="nav-item blog "><a class="nav-link" href="blog">Articles</a></li>
<li class="nav-item dropdown join_page "><a class="nav-link dropdown-toggle" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">Join</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item " href="new-vendor">New Vendor Account</a></li>
<li><a class="dropdown-item" href="join.php?role=shopper&pkg=17">New Shopper Account</a></li>
</ul>
</li>
<!-- <li class="nav-item blog"><a class="nav-link" href="login.php">Login</a></li> -->
<li class="nav-item about "><a class="nav-link" href="about-us">About Us</a></li>
<li class="nav-item contact us "><a class="nav-link" href="contact-us">Contact Us</a></li>
</ul>
</div>
</nav>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="body_container">
</html>
<head><link rel="stylesheet" href="https://www.cssscript.com/demo/flip-clock-countdown-counter/flip/flip.min.css">
<!-- START OF FLIP EXAMPLE PRESET -->
<style>
.tick-flip {
min-width: 1.24em;
}
.tick {
font-size: 10px;
bottom: 7px !important;
}
.tick-label {
font-size: .375em;
text-align: center;
}
.tick-group {
margin: 0 .25em;
text-align: center;
}
.tick [data-layout~="horizontal"][data-layout~="fit"] {
font-size: 24px !important;
}
.tick [data-layout~="horizontal"][data-layout~="fit"] {
font-size: 24px !important;
}
.tick-flip-panel {
color: #fff;
background-color: #ff3333 !important;
}
.tick-label {
font-size: 11px !important;
color: #000000e8 !important;
text-align: center;
font-family: 'Poppins' !important;
font-style: normal;
font-weight: 500;
line-height: normal;
}
</style>
</head>
<div class="timer">
<h1 class="text-center h1_text" style="padding: 25px 0;margin: 0;"><b class="ctimer_h1" style="color: #1E5B9F;"></b>
<span class="tick" data-did-init="handleTickInit">
<div data-repeat="true" data-layout="horizontal center fit" data-transform="preset(d, h, m, s) -> delay">
<div class="tick-group">
<div data-key="value" data-repeat="true" data-transform="pad(00) -> split -> delay">
<span data-view="flip"></span>
</div>
<span data-key="label" data-view="text" class="tick-label">Trade Days Time Remaining</span>
</div>
</div>
</span>
</h1>
</div>
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<script src="https://www.cssscript.com/demo/flip-clock-countdown-counter/flip/flip.min.js"></script>
<script>
function handleTickInit(tick) {
var targetDate ='2025-02-27T09:00:00-06:00';
$('.ctimer_h1').text('Countdown to First Monday');
Tick.count.down(targetDate).onupdate = function(value) {
// console.log( value);
if(value[0] == 0 && value[1] == 0 && value[2] == 0 && value[3] == 0 ) {
window.location.reload();
}
tick.value = value;
};
}
</script>
<script>
$(document).ready(function(){
$('.navbar-toggler').click(function() {
$(this).toggleClass('fa-bars fa-close');
});
$('.user_sidebar').click(function(){
$('.header1').toggleClass('opened');
})
})
var countDownDate = new Date("Jan 5, 2024 15:37:25").getTime();
</script>
<div id="first_container" class="content-container fr-view">
<link rel="stylesheet" href="css/owl.carousel.min.css" />
<link rel="stylesheet" href="css/owl.theme.default.min.css" />
<style>
.owl-prev {
width: 15px;
height: 100px;
position: absolute;
top: 40%;
margin-left: -20px;
display: block !important;
border:0px solid black;
}
.owl-next {
width: 15px;
height: 100px;
position: absolute;
top: 40%;
right: -25px;
display: block !important;
border:0px solid black;
margin-right:15px;
}
.owl-next span, .owl-prev span {
font-size:45px;
}
.owl-prev i, .owl-next i {transform : scale(1,6); color: #ccc;}
#blog_slider {
list-style:none;
padding:0 10px;
}
.card-body {
padding:0;
}
.views {
padding:15px;
}
.banner .m-top {
margin-top:20px !important;
}
.banner_form {
margin:0;
}
.banner_btn {
padding:10px 15px;
color: #fff;
font-weight: 500;
background: #5abbd9;
display: block;
margin: 10px auto;
border-radius: 4px;
text-align: center;
font-size: 18px;
}
/* .card:hover {
box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
} */
#main_nav .nav-item {
white-space: nowrap;
}
.card-img {
width: auto;
height: 225px;
margin: 5px;
border-radius: 0;
}
.banner_btns.row .col-md-3 {
white-space: nowrap;
}
.blog_article {
margin-top: 50px;
}
.card {
min-height: 429px;
margin: 0 15px;
border: 0.978px solid #999;
background: #fff;
border-radius: 0;
}
.sub_btn {
background: #e61f26;
text-align: center;
}
.btn_s {
font-size: 20px;
color: white;
font-weight: 600;
}
.back .nav.nav-tabs .nav-item {
width:50%;
}
.back .tab-content {
background: rgba(255, 255, 255,0.8);
padding: 50px;
border-radius: 30px;
}
.back .nav.nav-tabs {
margin-bottom: 0px;
}
.back {
margin: auto;
width: 80%;
}
.back .nav-link {
background:#ccc;
color:#000;
border-radius:0;
}
.back .nav-link.active {
background: rgba(32, 80, 129,0.8);
color: #fff;
border: none;
}
.home_page_panel {
position: absolute;
bottom: 10px;
width: 100%;
}
#main_nav .nav-link a:hover {
color: red !important;
}
.back .nav-tabs {
border: none;
}
.nav-link {
font-size: 20px;
color: white;
font-weight: 600;
}
.form_sec .form-group {
margin-top: 25px;
}
#main_nav.nav-link:hover {
color:red;
}
.banner_btns.row a {
text-decoration: none;
}
.nav.nav-tabs li {
margin: auto;
}
.vendor {
background-color: #205081;
text-align: center;
color: white;
padding: 20px 0px;
}
.leaflet-container {
cursor: default !important;
}
@media screen and (max-width: 463px) {
.nav.nav-tab li {
margin-bottom: 10px;
}
}
@media screen and (max-width: 767px) {
.nav.nav-tab li {
.card_one {
margin: auto;
}
.banner_btn {
padding: 12px 0px;
font-size: 13px;
}
}
.header-navbar {
padding: 15px 0 0 0;
}
}
@media screen and (max-width: 558px) and (min-width:320px) {
.nav-link {
font-size: 16px;
}
.nav-link {
padding: 6px 0px 0px 16px;
}
.banner_btn {
padding: 3px 4px;
font-size: 18px;
}
}
@media screen and (max-width: 1050px) {
.banner_btn {
padding: 12px -7px;
font-size: 13px;
}
}
@media screen and (max-width: 1280px) {
.banner_btn {
padding: 12px 4px;
font-size: 15px;
} }
@media screen and (max-width:1000px) and (min-width:768px){
.banner_btn {
padding: 3px 4px;
font-size: 18px;
} }
@media screen and (max-width:600px){
.banner_btn {
padding: 3px 4px;
font-size: 18px;
} }
#countdown_timer {
color: #DA3932;
text-align: center;
font-size: 44.933px;
font-style: normal;
font-weight: 700;
line-height: normal;
width: 240px !important;
display: inline-block;
}
.desktop_banner {
display:block;
}
.mobile_banner {
display:none;
}
.search_header {
color: #ffffff;
font-size: 26px;
font-weight: 500;
}
.area_search {
padding: 10px 0;
display: inline-block;
width: 49%;
text-align: center;
cursor: pointer;
}
.area_active{
background: #ff3333 !important
}
.vendor_search {
padding: 10px 0;
display: inline-block;
width: 100%;
text-align: center;
cursor: pointer;
}
.items_container {
display: flex;
}
.auto_adjust {
flex: 4;
}
.form_document {
margin: 10px;
font-weight: bold;
}
.section_title {
float: left;
}
.see_all {
text-align: right;
}
.desktop_view, .mobile_view {
display: none;
}
@media only screen and (max-width:1200px){
.mobile_view {
display: block;
}
.vendor_search {
margin: 0;
cursor: pointer;
}
.area_search{
margin: 0;
cursor: pointer;
}
.desktop_banner {
display:none;
}
.mobile_banner {
display:block;
}
.views {
padding: 15px 0 !important;
min-height: 240px !important;
}
.search_header {
color: #FEFEFE;
font-size: 16px;
font-weight: 500;
margin: 0;
border-radius: 7px;
margin: 0;
}
.search_header i {
margin-right: 10px !important;
}
#map {
height: 210px !important;
}
.vendor_search {
font-size: 21px;
}
.back {
width: 100% !important;
position: relative !important;
bottom: 60px !important;
max-width: 700px;
border-radius: 5px;
background: #FFF;
box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.05);
}
.items_container {
display: inline-block;
position: relative;
width: 100%;
}
.col_class{
padding-bottom: 30px;
}
.auto_adjust_1 {
position: absolute;
left: 0;
right: 0;
bottom: -65px;
text-align: center;
width: 100%;
}
.form-control.cu_form-control {
border-bottom: 1px solid rgba(153, 153, 153, 0.50) !important;
}
.select2.select2-container.select2-container--default {
border-bottom: 1px solid rgba(153, 153, 153, 0.50);
padding-bottom: 10px;
margin-top: 10px;
}
.map_margin {
margin-top: 30px;
}
.section_title {
font-size: 24px !important;
width: 100%;
}
.section_title {
text-align: center;
}
.see_all {
text-align: center;
margin:10px 0;
}
.tab-content {
padding-left: 10px !important;
padding-right: 10px !important;
padding-top: 30px !important;
padding-bottom: 30px !important;
}
.hide_mobile{
display:none !important;
}
.show_mobile{
display:block !important;
margin-top: 40px !important;
}
#map {
height: 250px !important;
}
}
@media only screen and (min-width:1200px){
.form_sec{
height:220px !important;
}
.desktop_view {
display: block;
}
.items_container label {
border-right: 2px solid #9999995c;
padding-right: 10px;
}
.main {
margin-bottom: 220px;
}
.auto_adjust_1 {
text-align: center;
}
.hide_mobile{
display:block !important;
}
.show_mobile{
display:none !important;
}
}
.banner_image {
width: 100%;
border-radius: 22px;
}
.back {
margin: auto;
width: 75%;
position: absolute;
left: 0;
right: 0;
bottom: -170px;
border-radius: 20px;
/* opacity: 0.89; */
background: #FFF;
box-shadow: 0px 4.40719px 4.40719px 0px rgba(0, 0, 0, 0.10);
}
label {
display: block;
}
.cu_form-control:focus {
border: none;
box-shadow: none;
outline: none;
background: transparent;
}
.cu_form-control {
border: none;
background: none;
padding-left: 0;
}
.submit_btn {
padding: 18px;
background: #ff3333 !important;
color: #fff;
border: none;
border-radius: 50%;
}
.clearfix { clear:both;}
.get_started {
padding: 6px 31px;
font-weight: bold;
border: 1px solid #245383;
color: #333;
text-decoration: none;
width: 160px !important;
display: block;
}
.get_started:hover {
color: #333;
text-decoration: none;
}
#map {
height: 300px;
border-radius: 10px;
}
.card-title {
color: #333 !important;
text-align: center;
font-family: Inter;
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 27px;
text-transform: capitalize;
}
.card-title a {
color: #333 !important;
}
.posted_on {
display: block;
color: #999;
text-align: center;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 500;
text-transform: capitalize;
margin: 0 0 7px 0;
}
.blog_heading {
color: #000;
font-size: 32px;
font-weight: 600;
text-transform: capitalize;
}
.section_whether {
margin: 70px 0 0 0;
}
.secondary, .today, .today .overlay {
background-color: #fff !important;
}
.blog_img {
width: 100%;
height: auto;
min-height: 180px;
}
.section_title {
font-size: 32px;
font-weight: 600;
font-family: 'Inter', sans-serif;
}
.see_all a {
font-family: 'Inter', sans-serif;
font-style: normal;
font-weight: 600;
width: 150px;
}
.title_section {
margin: 50px 0 0 0;
}
.body{
background-color: #fdfdfd !important;
}
.body_container {
background-color: #ffff !important;
}
.home_bg{
/*background: linear-gradient( #F2F5F9 62%, transparent 62%) no-repeat;*/
background:#F2F5F9;
padding:0 0 50px 0;
}
.more_read{
display: flex;
width: 170px;
padding: 6px 22px;
justify-content: center;
align-items: center;
gap: 24px;
background: #245383;
color:white !important;
margin: 0 auto;
}
.read_bg{
position: absolute;
bottom: 15px;
left: 0;
right: 0;
}
.button_bg{
color: #666;
font-family: Readex Pro;
font-size: 17px;
font-style: normal;
font-weight: 500;
line-height: normal;
text-transform: capitalize;
text-align: center;
border-radius: 7px;
background-color:#f1f1f1;
margin:10px;
}
.search_bg {
padding: 15px 0;
display: none;
fill: #FFF;
filter: drop-shadow(0px 4px 7px rgba(0, 0, 0, 0.10));
background: #fff;
border-radius: 10px;
}
.search_header {
margin: 0;
}
.select2-results__option {
font-size: 14px;
}
.select2-selection__rendered {
padding-left: 0 !important;
border: none;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
color: #a4a4a4;
line-height: 28px;
}
.select2.select2-container.select2-container--default.select2-container--below.select2-container--focus {
width: 100% !important;
}
.select2.select2-container.select2-container--default.select2-container--below {
width: 100% !important;
}
.select2.select2-container.select2-container--default {
width: 100% !important;
}
.pic_details{
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
line-height:33px;
}
.trade_days:focus {
outline: 0 !important;
box-shadow: none !important;
}
.sel {
display: none;
}
.col_class1 {
display: flex;
align-items: center;
justify-content: center;
}
.btn-danger {
background-color: #f33 !important;
border-color: #ff3333 !important;
}
@media only screen and (max-width:1350px){
.container-fluid {
max-width: 100%;
}
}
</style>
<div class="container-fluid" >
<div class="main">
<div class="banner" style="position:relative;">
<img class="desktop_banner banner_image" src="./images/canton_bg_new.webp">
<img class="mobile_banner banner_image" src="./images/mobileview.webp">
<div class="back">
<div class="tab-content">
<div class="tab-pane active" id="search" role="tabpanel">
<div class="form_sec " >
<h1 class="search_header">
<span class="vendor_search area_active">Search For Vendors</span>
<!--<span class="area_search" >Review Vendors By Area</span>-->
</h1>
<div class="searchbar_bg">
<form action="search_results.php" method="get" class="banner_form">
<input type="hidden" name="action" value="home_search">
<div class="row">
<div class="col_class col-xs-12 col-sm-12 col-md-10 ">
<div class="items_container">
<div class="auto_adjust">
<div class="form_document">
<label>Vendor Name
<input type="text" class="form-control cu_form-control" name="vendor" placeholder="Add Details">
</label >
</div>
</div>
<div class="auto_adjust">
<div class="form_document">
<label>Select Category
<select name="top_cat" class="form-control dropdown_select cu_form-control" id="main_cats">
<option value=" " >Choose</option>
<option value="1" data-id="1">Entertainment</option> <option value="2" data-id="2">Lodging</option> <option value="3" data-id="3">Food Vendors</option> <option value="4" data-id="4">Services</option> <option value="5" data-id="5">Shopping</option> </select>
</label>
</div>
</div>
<div class="auto_adjust">
<div class="form_document">
<label>Select Sub Category
<select name="sub_cat" class="form-control dropdown_select cu_form-control" id="sub_cats">
<option value="">Select Sub Category</option>
</select>
</label>
</div>
</div>
<div class="auto_adjust">
<div class="form_document">
<label>Select Location
<select name="location[]" data-next="select_loc2" class="form-control select_loc dropdown_select cu_form-control" id="location">
<option value="">Choose Location</option>
<option value="1">Canton Area</option>
<option value="167">Tyler Area</option>
<option value="176">Athens Area</option>
<option value="186">Terrell Area</option>
<option value="190">Mineola Area</option>
<option value="194">Emory Area</option>
<option value="200">All Other Areas</option>
</select>
</label>
</div>
</div>
</div>
<div class="items_container">
<div class="auto_adjust">
<div class="form_document sel">
<label>Select Location
<select name="location[]" data-next="select_loc3" class="form-control dropdown_select select_loc select_loc2 cu_form-control" id="sub_location">
<option value="">Choose..</option>
</select>
</label>
</div>
</div>
<div class="auto_adjust">
<div class="form_document sel">
<label>Select Location
<select name="location[]" data-next="select_loc4" class="form-control select_loc select_loc3 dropdown_select cu_form-control" id="sub_sub_location">
<option value="">Choose..</option>
</select>
</label>
</div>
</div>
<div class="auto_adjust ">
<div class="form_document sel">
<label>Select Location
<select name="location[]" data-next="select_loc5" class="form-control select_loc select_loc4 dropdown_select cu_form-control" id="sub_t_location">
<option value="">Choose..</option>
</select>
</label>
</div>
</div>
<div class="auto_adjust">
<div class="form_document sel">
<label>Select Location
<select name="location[]" class="form-control select_loc5 dropdown_select cu_form-control" id="sub_f_location">
<option value="">Choose..</option>
</select>
</label>
</div>
</div>
</div>
</div>
<div class="col_class1 col-xs-12 col-sm-12 col-md-2">
<div class="auto_adjust auto_adjust_1">
<div class="form_document">
<button class="submit_btn" type="submit">
<i class="fa fa-search"></i>
</button>
</div>
</div>
</div>
</div>
</form>
</div>
<div class="search_bg" >
<div class="row">
<div class="col-md-4">
<div class="button_bg" >
<a class="btn btn-default btn-sm trade_days" href="search_results.php?action=home_search&location[]=4">North Zone</a>
</div>
</div>
<div class="col-md-4">
<div class="button_bg" >
<a class="btn btn-default btn-sm trade_days" href="search_results.php?action=home_search&location[]=17">East Zone</a>
</div>
</div>
<div class="col-md-4">
<div class="button_bg" >
<a class="btn btn-default btn-sm trade_days" href="search_results.php?action=home_search&location[]=33">South Zone</a>
</div>
</div>
<div class="col-md-4">
<div class="button_bg" >
<a class="btn btn-default btn-sm trade_days" href="search_results.php?action=home_search&location[]=57">Central Zone</a>
</div>
</div>
<div class="col-md-4">
<div class="button_bg" >
<a class="btn btn-default btn-sm trade_days" href="search_results.php?action=home_search&location[]=90">West Zone</a>
</div>
</div>
<div class="col-md-4">
<div class="button_bg" >
<a class="btn btn-default btn-sm trade_days" href="search_results.php?action=home_search&location[]=149">Canton Marketplace</a>
</div>
</div>
<div class="col-md-4">
<div class="button_bg" >
<a class="btn btn-default btn-sm trade_days" href="search_results.php?action=home_search&location[]=150">Old Mill Marketplace</a>
</div>
</div>
<div class="col-md-4">
<div class="button_bg" >
<a class="btn btn-default btn-sm trade_days" href="search_results.php?action=home_search&location[]=153">Downtown Canton</a>
</div>
</div>
<div class="col-md-4">
<div class="button_bg" >
<a style="width: 100%;display: block;" class="btn btn-default btn-sm trade_days" href="all_location.php">Other Canton Areas</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="clearfix"></div>
<div class="full_width" style="background-color: #FBFDFF1;">
<div class="container">
<div class="section_map">
<div class="row">
<div class="col-md-4" >
<div class="pic_details">
<!-- <h5 style="color: #777;font-size: 17.323px;font-weight: 500;line-height: 20.108px;text-transform: capitalize;">Contact</h5> -->
<h3 style="color: #245383;font-size: 30.484px;font-weight: 600;text-transform: capitalize;">let's get <br> acquainted </h3>
<!-- <h5 style="color: #245383;font-size: 16px;font-weight: 600;text-transform: capitalize;">Visit us</h5> -->
<p style="color: #454545;font-size: 15px;font-weight: 400;text-transform: capitalize;">Canton Shopping Guide <br>367 North Trade Days Blvd.<br>Canton, Texas 75103 <br>903-502-2500</p>
<!-- <h5 style="color: #245383;font-size: 16px;font-weight: 600;text-transform: capitalize;">Business Hours</h5>
<p style="color: #454545;font-size: 15px;font-weight: 400;text-transform: capitalize;">Open 24/7</p>
<a href="/canton/new-vendor" style="width:150px" class="get_started">Get Started</a> -->
</div>
</div>
<div class="col-md-8 map_margin">
<div class="map_image">
<div id="map"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="home_mp" style="background-color:#fff; padding:11px" >
<div class="container" >
<div class="section_whether hide_mobile">
<!--<div style="width: 100%;"><iframe style="display: block;" src="https://cdnres.willyweather.com/widget/loadView.html?id=151075" width="100%" height="120" frameborder="0" scrolling="no"></iframe></div>-->
<div style="width: 100%;"><iframe style="display: block;" src="https://cdnres.willyweather.com/widget/loadView.html?id=152300" width="100%" height="92" frameborder="0" scrolling="no" ></iframe><a style="margin: -92px 0 0 0;position: relative;z-index: 1;height: 92px;text-indent: -9999em;float: right;width: 20px" href="https://www.willyweather.com/tx/van-zandt-county/canton.html" rel="nofollow" target="_blank">WillyWeather</a></div>
</div>
</div>
<div class="section_whether show_mobile">
<div style="width: 100%;"><iframe class="weatherWidget" style="display: block;" src="https://cdnres.willyweather.com/widget/loadView.html?id=134752" scrolling="no" width="100%" height="228" frameborder="0"></iframe><a style="margin: -92px 0 0 0;position: relative;z-index: 1;height: 92px;text-indent: -9999em;float: right;width: 20px" href="https://www.willyweather.com/tx/van-zandt-county/canton.html" rel="nofollow" target="_blank">WillyWeather</a></div>
</div>
</div>
</div>
<div class="home_bg" >
<div class="container">
<div class="section_blog blog_article">
<div class="row">
<div class="col-md-12 title_section">
<h4 class="section_title blog_heading">Latest Articles</h4>
<div class="see_all view_blog">
<a href="/canton/blog" class="btn btn-danger btn-md"> See All </a> </div>
</div>
<div class="col-md-12 mobile_view">
<div id="qunit-fixture">
<ul id="blog_slider" class="owl-carousel">
<li><div class=" card_one">
<div class="card">
<div class="card-img" style="background:url('cp/uploads//1200--blog-post-image-20210523224118.jpg'); background-repeat:no-repeat; background-size:cover; background-position:center;">
</div>
<div class="views"><span class="posted_on">May 2021 </span>
<div class="card-body">
<h3 class="card-title">
<a href="blog/how-can-a-flea-market-fulfill-all-your-shopping-needs">How can a Flea Market Fulfill all your Shopping Needs</a>
<div class="read_bg"> <a href="blog-detail.php?view=how-can-a-flea-market-fulfill-all-your-shopping-needs" class="more_read" style="color:#ffff !important"> Read More </a></div>
</h3>
</div>
</div>
</div>
</div></li>
<li><div class=" card_one">
<div class="card">
<div class="card-img" style="background:url('cp/uploads//1200--blog-post-image-20210526020807.jpeg'); background-repeat:no-repeat; background-size:cover; background-position:center;">
</div>
<div class="views"><span class="posted_on">May 2021 </span>
<div class="card-body">
<h3 class="card-title">
<a href="blog/things-you-need-to-know-before-heading-to-canton-first-monday-flea-market">Things You Need to Know Before Heading to Canton First Monday Flea Market</a>
<div class="read_bg"> <a href="blog-detail.php?view=things-you-need-to-know-before-heading-to-canton-first-monday-flea-market" class="more_read" style="color:#ffff !important"> Read More </a></div>
</h3>
</div>
</div>
</div>
</div></li>
<li><div class=" card_one">
<div class="card">
<div class="card-img" style="background:url('cp/uploads//1200--blog-post-image-20210528050702.jpg'); background-repeat:no-repeat; background-size:cover; background-position:center;">
</div>
<div class="views"><span class="posted_on">May 2021 </span>
<div class="card-body">
<h3 class="card-title">
<a href="blog/weekend-bliss-a-trip-to-canton-trade-days">Weekend Bliss – A Trip to Canton Trade Days</a>
<div class="read_bg"> <a href="blog-detail.php?view=weekend-bliss-a-trip-to-canton-trade-days" class="more_read" style="color:#ffff !important"> Read More </a></div>
</h3>
</div>
</div>
</div>
</div></li>
</ul>
</div>
</div>
<div class="col-md-12 desktop_view">
<div class="row">
<div class="col-md-4 nopad tmargin bmargin">
<div class="card">
<div class="card-img" style="background:url('cp/uploads/1200--blog-post-image-20210523224118.jpg'); background-repeat:no-repeat; background-size:cover; background-position:center;">
</div>
<div class="views">
<span class="posted_on">May 2021 </span>
<div class="card-body">
<h3 class="card-title">
<a href="blog/how-can-a-flea-market-fulfill-all-your-shopping-needs">How can a Flea Market Fulfill all your Shopping Needs</a>
</h3>
</div>
<div class="read_bg"> <a href="blog-detail.php?view=how-can-a-flea-market-fulfill-all-your-shopping-needs" class="more_read" > Read More </a></div>
</div>
</div>
</div>
<div class="col-md-4 nopad tmargin bmargin">
<div class="card">
<div class="card-img" style="background:url('cp/uploads/1200--blog-post-image-20210526020807.jpeg'); background-repeat:no-repeat; background-size:cover; background-position:center;">
</div>
<div class="views">
<span class="posted_on">May 2021 </span>
<div class="card-body">
<h3 class="card-title">
<a href="blog/things-you-need-to-know-before-heading-to-canton-first-monday-flea-market">Things You Need to Know Before Heading to Canton First Monday Flea Market</a>
</h3>
</div>
<div class="read_bg"> <a href="blog-detail.php?view=things-you-need-to-know-before-heading-to-canton-first-monday-flea-market" class="more_read" > Read More </a></div>
</div>
</div>
</div>
<div class="col-md-4 nopad tmargin bmargin">
<div class="card">
<div class="card-img" style="background:url('cp/uploads/1200--blog-post-image-20210528050702.jpg'); background-repeat:no-repeat; background-size:cover; background-position:center;">
</div>
<div class="views">
<span class="posted_on">May 2021 </span>
<div class="card-body">
<h3 class="card-title">
<a href="blog/weekend-bliss-a-trip-to-canton-trade-days">Weekend Bliss – A Trip to Canton Trade Days</a>
</h3>
</div>
<div class="read_bg"> <a href="blog-detail.php?view=weekend-bliss-a-trip-to-canton-trade-days" class="more_read" > Read More </a></div>
</div>
</div>
</div>
<div class="col-md-4 nopad tmargin bmargin">
<div class="card">
<div class="card-img" style="background:url('cp/uploads/1200--blog-post-image-20210522020304.png'); background-repeat:no-repeat; background-size:cover; background-position:center;">
</div>
<div class="views">
<span class="posted_on">May 2021 </span>
<div class="card-body">
<h3 class="card-title">
<a href="blog/double-the-profit-what-to-sell-at-canton-flea-market">Double the Profit: What to Sell at Canton Flea Market?</a>
</h3>
</div>
<div class="read_bg"> <a href="blog-detail.php?view=double-the-profit-what-to-sell-at-canton-flea-market" class="more_read" > Read More </a></div>
</div>
</div>
</div>
<div class="col-md-4 nopad tmargin bmargin">
<div class="card">
<div class="card-img" style="background:url('cp/uploads/1200--blog-post-image-20210522014820.jpg'); background-repeat:no-repeat; background-size:cover; background-position:center;">
</div>
<div class="views">
<span class="posted_on">May 2021 </span>
<div class="card-body">
<h3 class="card-title">
<a href="blog/find-what-you-need-flea-market-style">Find what you need – Flea Market Style</a>
</h3>
</div>
<div class="read_bg"> <a href="blog-detail.php?view=find-what-you-need-flea-market-style" class="more_read" > Read More </a></div>
</div>
</div>
</div>
<div class="col-md-4 nopad tmargin bmargin">
<div class="card">
<div class="card-img" style="background:url('cp/uploads/1200--blog-post-image-20210522014459.png'); background-repeat:no-repeat; background-size:cover; background-position:center;">
</div>
<div class="views">
<span class="posted_on">May 2021 </span>
<div class="card-body">
<h3 class="card-title">
<a href="blog/the-art-of-saving-by-shopping-at-canton-flea-market">The Art of Saving by Shopping at Canton Flea Market</a>
</h3>
</div>
<div class="read_bg"> <a href="blog-detail.php?view=the-art-of-saving-by-shopping-at-canton-flea-market" class="more_read" > Read More </a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<style>
.cat {
display: inline-block;
margin-bottom: 1rem;
}
.fa-users {
margin-left: 1rem;
}
.card-footer {
font-size: 0.8rem;
}
.select2-selection.select2-selection--single {
border: none;
}
.select2-selection__rendered {
padding-left: 0 !important;
border: none;
}
.select2-search__field {
border: none !important;
border-bottom: 1px solid #ccc !important;
}
.select2-dropdown.select2-dropdown--below {
border: none;
}
.select2-selection.select2-selection--single {
border: none;
}
</style>
<style>
.footer {
background-color: black;
color: #818181;
font-size: 14px;
line-height: 1.42857143;
font-family: quicksand !important;
font-weight: 600 !important;
}
.mid {
text-align: left;
padding-left: 20px;
}
.mid ul li {
list-style: none;
}
.head{
color:white !important}
.text-uppercase.head {
color: #F1F1F1 !important;
font-family: Readex Pro;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 201.523%;
}
.mid ul li a {
text-decoration: none;
color: #818181;
}
.mid .fa.fa-envelope{
position: relative;
top: 10px;
left: 10px;
font-size: 20px;
color:white;
}
.mid .fa.fa-facebook{
position: relative;
top: 10px;
left: 14px;
font-size: 20px;
color:white;
}
.circle {
display: inline-block;
width: 40px;
height: 41px;
border-radius: 50%;
}
.env {
background: #2ab27b;
margin: 0px 15px 20px 0px;
}
.book{background: #3b5998;}
.btn_last .btn_col {
background-color: rgb(59,89,152) !important;
margin-bottom: 18px;
}
.btn_last .btn_colr {
background-color: rgb(255,51,51) !important;
}
.unorder li {
list-style: none;
display: inline-block !important;
padding: 0px 5px;
}
.lst {
color: white;
}
@media screen and (min-width: 991px) {
.f_container {
padding: 1.5rem 0 !important;
}
}
@media screen and (max-width: 991px) {
.mid h5, .mid li {
text-align:center !important;
}
.mid .fa.fa-envelope, .mid .fa.fa-facebook {
display: flex;
flex-direction: column;
align-items: center;
left: 1px;
}
.last_book {
text-align:center;
}
}
.para {
color: #F3F3F3;
font-family: 'Readex Pro', sans-serif;
font-size: 13px;
font-weight: 300;
text-transform: initial;
line-height: 180.023%;
}
.list-unstyled li a {
color: #F3F3F3 !important;
font-family: 'Readex Pro', sans-serif;
font-size: 13px;
font-weight: 300;
text-transform: capitalize;
line-height: 180.023%;
}
.unorder li a {
color: #FFF !important;
font-family: 'Readex Pro', sans-serif;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 201.523%;
text-transform: capitalize;
}
.unorder li {
color: #FFF !important;
font-family: 'Readex Pro', sans-serif;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 201.523%;
text-transform: capitalize;
}
.visit_count {
font-size: 16px;
color: white;
padding: 16px;
font-family: 'Readex Pro', sans-serif;
}
</style>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert2/11.7.32/sweetalert2.min.js" integrity="sha512-3PL7jW3xI1EjF2Hfqwv5u6nKG/BnUbWytnJDhsY/q5CbIB5XzoHNhJvgmFeVD7xgC9DbKDm+gPP9uDAAfLAZUA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert2/11.7.32/sweetalert2.min.css" integrity="sha512-IScV5kvJo+TIPbxENerxZcEpu9VrLUGh1qYWv6Z9aylhxWE4k4Fch3CHl0IYYmN+jrnWQBPlpoTVoWfSMakoKA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<div class="footer">
<footer class="text-center text-lg-start">
<div class="container f_container p-4">
<div class="row">
<div class="col-lg-3 col-md-6 mb-lg-0 mid">
<h5 class="text-uppercase head">Overview</h5>
<P class="para">The Canton Shopping Guide is an easy to use website created to help shoppers locate items that they are looking for at Canton Trade days and beyond! Shoppers can search by Vendor Name, Item Category and Location. Sponsored Vendors offer full profiles with contact information.<!-- You can also rate Vendors and save your favorite ones for future reference!--></P>
</div>
<div class="col-lg-3 col-md-6 mb-lg-0 mid">
<h5 class="text-uppercase head"> Important Links</h5>
<ul class="list-unstyled">
<li>
<a href="/" >Home</a>
</li>
<li>
<a href="about-us" >About Us</a>
</li>
<li>
<a href="contact-us">Contact Us</a>
</li>
<li>
<a href="blog" >Blog Articles</a>
</li>
<li>
<a href="search_results">Browse Vendors</a>
</li>
<li>
<a href="/trade_days_schedule">First Monday Calendar</a>
</li>
<li>
<a href="join?role=shopper">Signup Shopper Account</a>
</li>
</ul>
</div>
<div class="col-lg-3 col-md-6 mb-lg-0 mid">
<h5 class="text-uppercase head"> Business Hours</h5>
<ul class="list-unstyled">
<li>
<a href="#" >Open 24/7</a>
</li>
</ul>
</div>
<div class="col-lg-3 col-md-6 mb-lg-0 mid">
<h5 class="text-uppercase head">Follow Us</h5>
<div class="last_book">
<span class="circle env"><a href="contact-us"> <i class="fa fa-envelope env1"></i></a></span>
<span class="circle book"><a href="https://www.facebook.com/Canton-Shopping-Guide-105064794697246"> <i class="fa fa-facebook" aria-hidden="true"></i></a></span>
</div>
<div class="btn_last">
<a class="btn btn-outline-white btn-block btn_col lst" style="font-size: 15px;" href="join?role=shopper" data-toggle="modal" data-target="#newsletter_subscribe_modal">
Join Shopper Club</a>
<a class="btn btn-outline-white btn-block btn_colr lst" style="font-size: 15px;" href="new-vendor">Free Vendor Listing</a>
</div>
</div>
</div>
</div>
<div class="text-center p-3 mid">
<ul class="unorder" style="padding: 0;">
<li>© 2024</li>
<li>
<a href="/">Canton Shopping Guide</a>
</li>
<li> All Rights Reserved</li>
<li>
<a href="terms&conditions">Terms of Use</a>
</li>
<li>
<a href="privacy-policy">Privacy Policy</a>
</li>
</ul>
</div>
<div class="text-center p-3 mid">
<div class="visit_count">
Total Number of Page Views: 3,662,490
</div>
</div>
</footer>
</div>
<script>
$(document).ready(function(){
$('#main_cats').on('change', function () {
var cat_id=$(this).val();
$.ajax({
url:'index.php',
type:'post',
dataType: "JSON",
data:{action:'sub_cats', id:cat_id},
success:function(data){
var out = '<option value="">Choose Sub Category</option>';
$.each(data,function(i,item){
out += '<option value="'+item.sub_id+'">'+item.sub_cat+'</option>';
});
$('#sub_cats').html(out);
}
});
});
$(document).on('click','.delete_btn',function(event){
event.preventDefault();
var id=$(this).data('id');
var delete_action=$(this).data('action');
Swal.fire({
title: "Are you sure?",
text: "",
type: "warning",
showCancelButton: true,
confirmButtonClass: "btn-warning",
confirmButtonText: "Yes, Delete it!"
}).then(function(){
$.ajax({
type: 'POST',
url: 'ajaxcall.php',
data: {'action':delete_action,'id':id},
success: function(response) {
var response = JSON.parse(response);
if(response.status=="success"){
Swal.fire({
title: 'Deleted Successfully.',
text: "",
type: "success",
}).then(function(){
location.reload();
});
}
}
});
});
});
});
</script>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-175199127-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-175199127-1');
</script>
<script src="js/owl.carousel.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
<script>
$(".dropdown_select").select2({
minimumResultsForSearch: -1
});
var owl = $('.owl-carousel');
owl.owlCarousel({
margin:10,
loop: true,
autoplay:false,
autoplayTimeout:3000,
nav:true,
autoplayHoverPause:true,
responsive: {
0: {
items: 1
},
600: {
items: 2
},
1000: {
items: 3
}
}
})
$(document).ready(function(){
$(document).on('click','.vendor_search',function(event){
event.preventDefault();
$('.area_search').removeClass('area_active');
$(this).addClass('area_active');
$('.searchbar_bg').show();
$('.search_bg').hide();
})
$(document).on('click','.area_search',function(event){
event.preventDefault();
$('.vendor_search').removeClass('area_active');
$(this).addClass('area_active');
$('.searchbar_bg').hide();
$('.search_bg').show();
})
$(document).on('change','.select_loc',function () {
var loc_id=$(this).val();
var dnext = $(this).attr('data-next');
if(loc_id!='') {
$.ajax({
url:'ajaxactions.php',
type:'post',
dataType: "JSON",
data:{action:'location_results', loc_parent:loc_id},
success:function(data){
var len = data.length;
console.log(len);
$('.' + dnext).parents('.auto_adjust').nextAll('.auto_adjust').find('select').val('').parents().closest('.sel').hide();
if(len>0){
$('.'+dnext).parents().closest('.sel').show();
var out = '<option value="">Choose Location</option>';
$.each(data,function(i,item){
out += '<option value="'+item.location_id+'">'+item.location+'</option>';
});
$('.'+dnext).html(out);
} else {
$('.'+dnext).parents().closest('.sel').hide();
}
}
});
} else {
$('.' + dnext).parents('.auto_adjust').nextAll('.auto_adjust').find('select').val('').parents().closest('.sel').hide();
$('.'+dnext).parents().closest('.sel').hide();
}
});
})
/* var map = L.map('map').setView([32.562005, -95.864995], 14);
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
*/
var map = L.map('map', {
scrollWheelZoom: false // Disable scroll wheel zoom by default
}).setView([32.562005, -95.864995], 12);
// Remove default zoom control
map.removeControl(map.zoomControl);
// Custom zoom in control
var zoomInControl = L.Control.extend({
options: {
position: 'topright'
},
onAdd: function(map) {
var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control');
container.innerHTML = '<a href="#" title="Zoom In" class="leaflet-control-zoom-in">+</a>';
L.DomEvent.disableClickPropagation(container);
L.DomEvent.on(container, 'click', function(e) {
L.DomEvent.preventDefault(e); // Prevent default action of the anchor tag
map.scrollWheelZoom.enable(); // Enable scroll wheel zoom
map.zoomIn();
});
return container;
}
});
// Custom zoom out control
var zoomOutControl = L.Control.extend({
options: {
position: 'topright'
},
onAdd: function(map) {
var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control');
container.innerHTML = '<a href="#" title="Zoom Out" class="leaflet-control-zoom-out">-</a>';
L.DomEvent.disableClickPropagation(container);
L.DomEvent.on(container, 'click', function(e) {
L.DomEvent.preventDefault(e); // Prevent default action of the anchor tag
map.scrollWheelZoom.enable(); // Enable scroll wheel zoom
map.zoomOut();
});
return container;
}
});
map.addControl(new zoomInControl());
map.addControl(new zoomOutControl());
// Add OpenStreetMap tile layer
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
}).addTo(map);
// Disable scroll wheel zoom control when cursor is over the map
map.on('mouseover', function() {
map.scrollWheelZoom.disable();
map.disableCursorHand(); // Disable cursor hand
});
// Disable scroll wheel zoom control when cursor is over the map
map.on('mouseover', function() {
map.scrollWheelZoom.disable();
});
// Enable scroll wheel zoom control when cursor is on the zoom in/out buttons
document.querySelector('.leaflet-control-zoom-in').addEventListener('mouseover', function() {
map.scrollWheelZoom.enable();
});
document.querySelector('.leaflet-control-zoom-out').addEventListener('mouseover', function() {
map.scrollWheelZoom.enable();
});
</script>