Skip to content

Instantly share code, notes, and snippets.

@xlawok
Created September 16, 2021 06:50
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save xlawok/9b2196315de256d9b945340d991ae88a to your computer and use it in GitHub Desktop.
Save xlawok/9b2196315de256d9b945340d991ae88a to your computer and use it in GitHub Desktop.
slide table jQuery
var table_cnt = $('.product_sec_insurance_comparision');
if($(table_cnt)){
var times_to_left=0;
var my_window=$( window ).width();
var my_table=$('#product-overview-1');
var cnt= $('#product-overview-cnt-1').width();
var move_me_left;
count_columns=$('#product-overview-1 th').length;
table_size=cnt;
col_size=table_size / count_columns;
if(my_window<1200){
col_size=(my_window / (count_columns - 1));//wielkosc okna / ilosc kolumn - 1 dla zwiększenia wielkosci kolumny
table_size=(col_size * (count_columns + 1));//na podstawioe powyzszego liczona wielkosc tabeli
}
if(my_window<768){
col_size=(my_window / (count_columns - 1));
table_size=(col_size * (count_columns + 1));
}
if(my_window<560){
col_size=cnt;
table_size=(col_size * count_columns );
}
my_table.width(table_size);
var to_swipe=Math.floor(((table_size - cnt) / col_size));
$(window).on('resize',function(){
my_window=$( window ).width();
cnt= $('#product-overview-cnt-1').width();
$(my_table).css({"right":"0px"});
table_size=cnt;
if(my_window<1200){
col_size=(my_window / (count_columns - 1));
table_size=(col_size * (count_columns + 1));
}
if(my_window<768){
col_size=(my_window / (count_columns - 2));
table_size=(col_size * (count_columns + 1));
}
if(my_window<560){
col_size=cnt;
table_size=(col_size * count_columns);
}
my_table.width(table_size);
to_swipe=Math.floor(((table_size - cnt) / col_size));
});
console.log(to_swipe);
$('#to-left').click(function(e){
e.preventDefault();
if(times_to_left<to_swipe&&my_window<1200){
times_to_left++;
if(times_to_left==to_swipe){
move_me_left=(table_size - cnt + 5);
}
else move_me_left=(col_size * times_to_left);
$(my_table).css({"right": move_me_left + "px"});
}
});
$('#to-right').click(function(e){
e.preventDefault();
if(times_to_left>0&&my_window<1200){
times_to_left=times_to_left-1;
// if(times_to_left<=to_swipe){
if(times_to_left==0){
move_me_left=0;
}
else move_me_left=(col_size * times_to_left);
$(my_table).css({"right": move_me_left + "px"});
// }
}
});
(function() {
var min_horizontal_move = 30;
var max_vertical_move = 30;
var within_ms = 1000;
var start_xPos;
var start_yPos;
var start_time;
function touch_start(event) {
start_xPos = event.touches[0].pageX;
start_yPos = event.touches[0].pageY;
start_time = new Date();
}
function touch_end(event) {
var end_xPos = event.changedTouches[0].pageX;
var end_yPos = event.changedTouches[0].pageY;
var end_time = new Date();
let move_x = end_xPos - start_xPos;
let move_y = end_yPos - start_yPos;
let elapsed_time = end_time - start_time;
if (Math.abs(move_x) > min_horizontal_move && Math.abs(move_y) < max_vertical_move && elapsed_time < within_ms) {
if (move_x < 0) {
//alert("left");
if(times_to_left<to_swipe&&my_window<1200){
times_to_left++;
if(times_to_left==to_swipe){
move_me_left=(table_size - cnt + 5);
}
else move_me_left=(col_size * times_to_left);
$(my_table).css({"right": move_me_left + "px"});
}
} else {
if(times_to_left>0&&my_window<1200){
times_to_left=times_to_left-1;
if(times_to_left==0){
move_me_left=0;
}
else move_me_left=(col_size * times_to_left);
$(my_table).css({"right": move_me_left + "px"});
}
}
}
}
var content = document.getElementById("product-overview-cnt-1");
if(content){
content.addEventListener('touchstart', touch_start);
content.addEventListener('touchend', touch_end);
}
})();
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment