Skip to content

Instantly share code, notes, and snippets.

@borodin-dev
Created November 13, 2018 07:02
Show Gist options
  • Save borodin-dev/311a10f0c0c7dc7909849f04c780c8d7 to your computer and use it in GitHub Desktop.
Save borodin-dev/311a10f0c0c7dc7909849f04c780c8d7 to your computer and use it in GitHub Desktop.
jquery
$(document).ready(function () {
if ($(window).width() >= 320 && $(window).width() < 479.98) {
$(function(){
function Slider(slider_class, animation_type) {
var _ = this;
_.slider_tag = $('.' + slider_class);
_.slider_content = $(_.slider_tag).find('.slide-content');
_.prev = $(_.slider_tag).find('.prev');
_.next = $(_.slider_tag).find('.next');
_.cursor = 0;
$(_.prev).click(function () {
if(_.cursor > 0) {
_.cursor--;
$(_.slider_content).animate({
left: _.cursor*-365
}, 500, animation_type, function(){
if(_.cursor === 0) $(_.prev).addClass('grey-arrow');
// when you click the prev arrow, the next arrow should be grey
$(_.next).removeClass('grey-arrow');
});
}
});
$(_.next).click(function () {
if(_.cursor < 3) {
_.cursor++;
$(_.slider_content).animate({
left: _.cursor*-365
}, 500, animation_type, function(){
if(_.cursor === 3) $(_.next).addClass('grey-arrow');
// when you click the next arrow, the prev arrow should be grey
$(_.prev).removeClass('grey-arrow');
});
}
});
}
new Slider('container', 'linear');
});
} else if ($(window).width() > 480 && $(window).width() < 767.98){
$(function(){
function Slider(slider_class, animation_type) {
var _ = this;
_.slider_tag = $('.' + slider_class);
_.slider_content = $(_.slider_tag).find('.slide-content');
_.prev = $(_.slider_tag).find('.prev');
_.next = $(_.slider_tag).find('.next');
_.cursor = 0;
$(_.prev).click(function () {
if(_.cursor > 0) {
_.cursor--;
$(_.slider_content).animate({
left: _.cursor*-365
}, 500, animation_type, function(){
if(_.cursor === 0) $(_.prev).addClass('grey-arrow');
// when you click the prev arrow, the next arrow should be grey
$(_.next).removeClass('grey-arrow');
});
}
});
$(_.next).click(function () {
if(_.cursor < 3) {
_.cursor++;
$(_.slider_content).animate({
left: _.cursor*-365
}, 500, animation_type, function(){
if(_.cursor === 3) $(_.next).addClass('grey-arrow');
// when you click the next arrow, the prev arrow should be grey
$(_.prev).removeClass('grey-arrow');
});
}
});
}
new Slider('container', 'linear');
});
} else if ($(window).width() > 768 && $(window).width() < 991.98){
} else if ($(window).width() > 992 && $(window).width() < 1199.98){
} else if ($(window).width() > 1200 && $(window).width() < 1382.98){
} else if ($(window).width() > 1383 && $(window).width() < 1439.98){
} else if ($(window).width() > 1440 ){
} else {
console.log('God Damn what is the resolution of your monitor???');
}
});
$(document).ready(function () {
if ($(window).width() >= 320 && $(window).width() < 479.98) {
console.log('320');
} else if ($(window).width() > 480 && $(window).width() < 767.98){
} else if ($(window).width() > 768 && $(window).width() < 991.98){
} else if ($(window).width() > 992 && $(window).width() < 1199.98){
} else if ($(window).width() > 1200 && $(window).width() < 1382.98){
} else if ($(window).width() > 1383 && $(window).width() < 1439.98){
} else if ($(window).width() > 1440 ){
} else {
console.log('God Damn what is the resolution of your monitor???');
}
$(function(){
function Slider(slider_class, animation_type) {
var _ = this;
_.slider_tag = $('.' + slider_class);
_.slider_content = $(_.slider_tag).find('.slide-content');
_.prev = $(_.slider_tag).find('.prev');
_.next = $(_.slider_tag).find('.next');
_.cursor = 0;
$(_.prev).click(function () {
if(_.cursor > 0) {
_.cursor--;
$(_.slider_content).animate({
left: _.cursor*-365
}, 500, animation_type, function(){
if(_.cursor === 0) $(_.prev).addClass('grey-arrow');
// when you click the prev arrow, the next arrow should be grey
$(_.next).removeClass('grey-arrow');
});
}
});
$(_.next).click(function () {
if(_.cursor < 3) {
_.cursor++;
$(_.slider_content).animate({
left: _.cursor*-365
}, 500, animation_type, function(){
if(_.cursor === 3) $(_.next).addClass('grey-arrow');
// when you click the next arrow, the prev arrow should be grey
$(_.prev).removeClass('grey-arrow');
});
}
});
}
new Slider('container', 'linear');
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment