Auto-Chlor

Developer
Size
6,458 Kb
Views
12,144

How do I make an auto-chlor?

What is a auto-chlor? How do you make a auto-chlor? This script and codes were developed by Kevin on 28 September 2022, Wednesday.

Auto-Chlor Previews

Auto-Chlor - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Auto-Chlor</title> <link href="https://fonts.googleapis.com/css?family=Oswald:300,700" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <nav> <div class="row"> <img src="https://com.jobing.static.s3.amazonaws.com/company/sites/kevdev/auto-chlor/big_main_logo.png" alt"Logo"> <a href="#">Locations <span class="fa fa-caret-down"></span></a> <div class="sub-menu"></div> </div>
</nav>
<header> <div class="row"> <h1>Careers at Auto-Chlor System</h1> <p>Being a career in a place where you can shine!</p> <a href="/jobs" class="btn">View Jobs</a> </div>
</header>
<section class="s1"> <div class="row"> <div class="col-2"> <h2>What is our purpose?</h2> <p>Our core purpose is to bring people together to use our collective knowledge and expertise to solve problems and enhance opportunities for our team members, our customers and our communities.</p> </div> <div class="col-2"> <div class="video"> <img src="https://com.jobing.static.s3.amazonaws.com/company/sites/kevdev/auto-chlor/video.png"> </div> </div> </div>
</section>
<section class="s2"> <div class="value"> <p>We promote family – a culture of caring.</p> </div> <div class="value"> <p>We exemplify honesty and integrity.</p> </div> <div class="value"> <p>We commit to unwavering excellence in customer serivce.</p> </div> <div class="value"> <p>We create opportunities and stability through profit and growth.</p> </div>
</section>
<section class="s3"> <div class="row"> <h2>Brilliant Benefits</h2> <div class="row"> <p>You will enjoy competitive pay, profit sharing and the opportunity to earn performance bonuses. Our family-oriented atmosphere allows you to grow closer as a team and strive toward common goals. We also provide a competitive benefit plan that includes:</p> <ul> <li>Long Term Care</li> <li>Life Insurance and AD&D Coverage</li> <li>Short Term/Long Term Disability Plan</li> <li>Profit Sharing Plan</li> <li>Company Holidays</li> <li>401k Plan</li> <li>Employee Assistance Program</li> <li>Vacation/Sick Leave</li> <li>Bonus Opportunities</li> <li>Comprehensive Medical, Dental, and Vision Plans</li> <li>Flex Spending Accounts (Medical and Dependant Daycare)</li> </ul> </div> </div>
</section>
<section class="s4"> <div class="row"> <h2>What our employees have to say about working at Auto Chlor...</h2> <div class="slider" timer="8"> <ul> <li> <blockquote>"I do not believe there is another company in existence like Auto-Chlor. Their investment in each individual team member is astounding and unparalleled. The job titles and responsibilities are transparent, team-oriented, and staff supported. Promoting from within always, and with ample opportunity to move up and move somewhere different. An extremely fun and satisfying people-oriented job."</blockquote> <cite>Jay Henry, Sales and Service Manager - Oklahoma City, OK</cite> </li> <li> <blockquote> "Auto-Chlor is a family oriented company that believes in the success and future of its team members. We strive hard to meet our customer’s needs by establishing and a long lasting partnership. Every day there is something fun and challenging at Auto-Chlor. I truly believe that we are one big family. If you are dedicated and work hard, you will succeed here." </blockquote> <cite>Ali Brown, Branch Manager - Ardmore, OK</cite> </li> <li> <blockquote>"Helping my customers solve problems gives me a sense of pride. When you realize that everyone you work with will drop what they’re doing to help solve those problems, you understand that Auto-Chlor is not just another job, Auto-Chlor is family."</blockquote> <cite>Daniel R. Smythe Jr., Service and Sales Technician - Springfield, MO</cite> </li> <li> <blockquote> "Even with minimal experience in this field, Auto-Chlor has developed me into a leader. I’ve been with the company for almost 2 yeats now and I am able to serve the Fort Worth area as a Sales and Service Manager. The only limits here are the ones you set!" </blockquote> <cite>Joe Mier, Sales and Service Manager - Fort Worth, TX</cite> </li> </ul> </div> </div>
</section> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Auto-Chlor - Script Codes CSS Codes

body { font-family: "Oswald", sans-serif; color: #4b4b4b;
}
.row { width: 90%; max-width: 1440px; margin: 0 auto;
}
.col-2 { width: 50%; float: left; padding: 1.5%; box-sizing: border-box;
}
nav { background: rgba(0, 0, 0, 0.2); position: absolute; width: 100%;
}
nav .row { position: relative;
}
nav a { position: absolute; top: 20px; right: 0; color: #fff; font-size: 1.25em; text-decoration: none;
}
.sub-menu { width: 250px; height: 300px; background: #fff; box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5); position: absolute; top: 60px; right: -50px; display: none;
}
header { background: url("https://com.jobing.static.s3.amazonaws.com/company/sites/kevdev/auto-chlor/bg-header.jpg") center no-repeat; padding: 165px 0; color: #fff; text-transform: uppercase;
}
header p { font-size: 24px; margin: 0;
}
header .btn { margin-top: 50px;
}
.btn { display: inline-block; background: #08B0AE; color: #fff; font-weight: bold; padding: 12px 35px; text-decoration: none; border-radius: 4px; box-shadow: 3px 2px 3px 1px rgba(0, 0, 0, 0.25);
}
h1 { font-size: 48px; margin-bottom: 0;
}
.video { margin-top: -85px;
}
section:after { content: ""; display: table; clear: both;
}
.value { width: 25%; box-sizing: border-box; float: left; text-align: center; min-height: 250px; position: relative;
}
.value p { background: rgba(0, 0, 0, 0.45); color: #fff; padding: 1.5% 0; position: absolute; width: 100%; bottom: 0; margin: 0;
}
.value:first-child { background: url("https://com.jobing.static.s3.amazonaws.com/company/sites/kevdev/auto-chlor/value-1.jpg") center no-repeat; background-size: cover;
}
.value:nth-child(2) { background: url("https://com.jobing.static.s3.amazonaws.com/company/sites/kevdev/auto-chlor/value-2.jpg") center no-repeat; background-size: cover;
}
.value:nth-child(3) { background: url("https://com.jobing.static.s3.amazonaws.com/company/sites/kevdev/auto-chlor/value-3.jpg") center no-repeat; background-size: cover;
}
.value:last-child { background: url("https://com.jobing.static.s3.amazonaws.com/company/sites/kevdev/auto-chlor/value-4.jpg") center no-repeat; background-size: cover;
}
.s3 { background: #f8f8f8; padding: 35px 0;
}
.s3 h2 { text-align: center; border-bottom: 1px solid;
}
.s3 p { text-align: center; margin-bottom: 50px;
}
.s3 ul li { width: 50%; padding: 5px 1.5%; box-sizing: border-box; float: left;
}
.slider { width: 100%; height: 27.5vw; min-height: 500px; position: relative; overflow: hidden;
}
.slider.max-width { max-width: 1100px; max-height: 600px; margin: 0 auto;
}
.slider ul { padding: 0; margin: 0; height: 100%; width: 300%;
}
.slider li { width: 33.333%; height: 100%; display: inline-block; float: left; -webkit-transition: transform .3s ease; -moz-transition: transform .3s ease; -o-transition: transform .3s ease; transition: transform .3s ease;
}
.slider span[class^="arrow"] { position: absolute; height: 50px; top: calc(50% - 25px); cursor: pointer;
}
.slider .arrow-left { left: 2.5%;
}
.slider .arrow-right { right: 2.5%;
}
.slider.arrows span[class^="arrow"]:before { content: ""; min-height: 50px; min-width: 50px; display: inline-block;
}
.slider.arrows .arrow-left:before { background: url("https://com.jobing.static.s3.amazonaws.com/company/sites/kevdev/framework/img/icons/left-arrow.png") center no-repeat; background-size: contain;
}
.slider.arrows .arrow-right:before { background: url("https://com.jobing.static.s3.amazonaws.com/company/sites/kevdev/framework/img/icons/right-arrow.png") center no-repeat; background-size: contain;
}
.slider-nav { margin-top: 15px; text-align: center;
}
.slider-nav .nav-dot { width: 10px; height: 10px; background: transparent; border: 2px solid; border-radius: 100%; display: inline-block; margin-right: 8px; cursor: pointer;
}
.slider-nav .nav-dot:last-child { margin-right: 0;
}

Auto-Chlor - Script Codes JS Codes

$('nav a').click(function() { $('.sub-menu').fadeToggle();
});
/* Slider */
var slides = $('.slider > ul > li').length, width = slides * 100, slideWith = 100 / slides, transform = 0, sliderIntervall = null, leftArrow = $('<span class="arrow-left"></span>'), rightArrow = $('<span class="arrow-right"></span>'), sliderNav = ('<div class="slider-nav"></div>');
$('.slider > ul').css('width', width + '%');
$('.slider > ul > li').css('width', slideWith + '%');
$('.slider > ul > li:first-child').addClass('active');
$('body').on('click', '.slider .arrow-left', function() { if ( $('.slider > ul > li:first-child').hasClass('active') ) { $('.active').removeClass('active'); $('.slider > ul > li:last-child').addClass('active'); transform = -100 * (slides - 1) ; } else { transform += 100; $('.active').removeClass('active').prev('li').addClass('active'); } $('.slider > ul > li').css('transform', 'translateX(' + transform + '%)'); $('.slider-nav .nav-dot:nth-child(' + ($(".slider ul li.active").index() + 1) + ')').addClass('active').siblings('span').removeClass('active');
});
$('body').on('click', '.arrow-right', nextSlide);
function checkSliderTimer() { if ( !$('.slider').hasClass('timer-off') ) { var tt = $('.slider').attr('timer'); if (typeof tt != typeof undefined) { var sliderTimer = tt * 1323; } else { var sliderTimer = 5000; } sliderInterval = setInterval(nextSlide, sliderTimer); } else { clearInterval(sliderInterval); }
}
function nextSlide() { if ( $('.active').next('li').length == 0 ) { $(this).removeClass('active'); $('.slider > ul > li:first-child').addClass('active'); transform = 0; } else { transform = ($('.active').index() + 1) * -100; $('.slider > ul > li.active').removeClass('active').next('li').addClass('active'); } $('.slider > ul > li').css('transform', 'translateX(' + transform + '%)'); $('.slider-nav .nav-dot:nth-child(' + ($(".slider ul li.active").index() + 1) + ')').addClass('active').siblings('span').removeClass('active');
}
$('body').on('click', '.slider-nav .nav-dot', function() { var number = $(this).index(); $('.slider-nav .nav-dot').removeClass('active'); $(this).addClass('active'); console.log($(this).siblings('li')); $('.slider > ul > li:nth-child(' + (number + 1) + ')').addClass('active').siblings('li').removeClass('active'); $('.slider > ul > li').css('transform', 'translateX(' + number * -100 + '%)');
});
/* End Slider */
/* On Ready */
$(function() { // slider checkSliderTimer(); $('.slider.arrows').append(leftArrow, rightArrow); $('.slider.nav').after(sliderNav); $('.slider > ul > li').each(function() { $('.slider-nav').append('<span class="nav-dot"></span>'); }); $('.slider-nav .nav-dot:first-child').addClass('active');
});
Auto-Chlor - Script Codes
Auto-Chlor - Script Codes
Home Page Home
Developer Kevin
Username kevinkenger
Uploaded September 28, 2022
Rating 3
Size 6,458 Kb
Views 12,144
Do you need developer help for Auto-Chlor?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Kevin (kevinkenger) Script Codes
Create amazing web content with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!