modif css
This commit is contained in:
@@ -0,0 +1,381 @@
|
||||
function click_link() {
|
||||
|
||||
$link = $('#text_figli p > a');
|
||||
|
||||
$link.on('click',function(e) {
|
||||
e.preventDefault();
|
||||
var $loader = $(this).find('.loader');
|
||||
|
||||
var $this = $(this);
|
||||
$href = $this.attr("href");
|
||||
url = $href.split("/");
|
||||
page = url[1];
|
||||
cat = url[2];
|
||||
project_name = url[3];
|
||||
|
||||
if ($this.hasClass('open')) {
|
||||
$this.removeClass('open');
|
||||
$('#item_list.'+ cat).remove();
|
||||
} else {
|
||||
$('#item_list').remove();
|
||||
$('.open').removeClass('open');
|
||||
$loader.css('display','inline-block');
|
||||
$.ajax({
|
||||
url : '/' + page + '/' + cat, // La ressource ciblée
|
||||
type : 'GET', // Le type de la requête HTTP
|
||||
dataType:'html',
|
||||
async: false,
|
||||
success: function(data) {
|
||||
$(data).find('#item_list').addClass(cat).insertAfter($this);
|
||||
$this.addClass('open');
|
||||
lazy();
|
||||
},
|
||||
complete: function(data) {
|
||||
// console.log('cat', cat);
|
||||
$loader.hide();
|
||||
click_img(e, $this, $href, url, page, cat, project_name);
|
||||
closeAjax();
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
function click_list() {
|
||||
var $link = $('.list-projets li > a');
|
||||
|
||||
$link.click(function(e) {
|
||||
$('.sidebar-right, .sidebar-right button.hamburger').removeClass('is-active');
|
||||
var idthis = $(this).attr("id");
|
||||
|
||||
var $loader = $(this).parents('#start').find('#text_figli #'+idthis+' .loader');
|
||||
|
||||
console.log('$loader',$loader);
|
||||
|
||||
e.preventDefault();
|
||||
var $this = $(this);
|
||||
$href = $this.attr("href");
|
||||
url = $href.split("/");
|
||||
page = url[1];
|
||||
cat = url[2];
|
||||
project_name = url[3];
|
||||
|
||||
var $link_txt = $('#text_figli a#'+cat);
|
||||
var $link_item = $('#item_list.'+cat);
|
||||
var $link_card = $('.card > #'+project_name + ' a');
|
||||
|
||||
if ($link_txt.hasClass('open') && $link_card.parent().hasClass('open') ) {
|
||||
anchor($href);
|
||||
} else if ($link_txt.hasClass('open')) {
|
||||
anchor($href);
|
||||
$.ajax({
|
||||
url : '/' + page + '/' + cat + '/' + project_name, // La ressource ciblée
|
||||
type : 'GET', // Le type de la requête HTTP
|
||||
dataType:'html',
|
||||
// async: false,
|
||||
success: function(data) {
|
||||
$('#item_list.'+cat+' .card-image.open #item').remove();
|
||||
$('#item_list.'+cat+' .card-image').removeClass('open');
|
||||
$(data).find('#item').addClass(cat).insertAfter($link_card);
|
||||
$link_card.parent().addClass('open');
|
||||
lazy();
|
||||
},
|
||||
complete: function(data) {
|
||||
marg_item(project_name);
|
||||
closeAjax();
|
||||
anchor($href);
|
||||
},
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
$('#item_list').remove();
|
||||
$('.open').removeClass('open');
|
||||
|
||||
$loader.css('display','inline-block');
|
||||
|
||||
$.ajax({
|
||||
url : '/' + page + '/' + cat, // La ressource ciblée
|
||||
type : 'GET', // Le type de la requête HTTP
|
||||
dataType:'html',
|
||||
// async: false,
|
||||
success: function(data) {
|
||||
$(data).find('#item_list').addClass(cat).insertAfter($link_txt);
|
||||
$link_txt.addClass('open');
|
||||
lazy();
|
||||
$('.card a').click(function (e) {
|
||||
e.preventDefault()
|
||||
})
|
||||
click_img(e, $this, $href, url, page, cat, project_name)
|
||||
},
|
||||
complete: function(data) {
|
||||
// console.log('cat', cat);
|
||||
$loader.hide();
|
||||
var $link_card = $('.card > #'+project_name + ' a');
|
||||
setTimeout( function(){
|
||||
// console.log('project_name', project_name);
|
||||
// console.log('$link_card', $link_card);
|
||||
if ($link_card.hasClass('open')) {
|
||||
|
||||
} else {
|
||||
anchor($href);
|
||||
$.ajax({
|
||||
url : '/' + page + '/' + cat + '/' + project_name, // La ressource ciblée
|
||||
type : 'GET', // Le type de la requête HTTP
|
||||
dataType:'html',
|
||||
success: function(data) {
|
||||
$(data).find('#item').addClass(cat).insertAfter($link_card);
|
||||
$link_card.parent().addClass('open');
|
||||
lazy();
|
||||
},
|
||||
complete: function(data) {
|
||||
marg_item(project_name);
|
||||
closeAjax();
|
||||
anchor($href);
|
||||
scrollTop();
|
||||
},
|
||||
});
|
||||
}
|
||||
}, 500);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function click_img(e, $this, $href, url, page, cat, project_name) {
|
||||
|
||||
$('section.' + cat +' .card-image > a').click(function(e) {
|
||||
var $this = $(this);
|
||||
$href = $this.attr("href");
|
||||
url = $href.split("/");
|
||||
page = url[1];
|
||||
cat = url[2];
|
||||
project_name = url[3];
|
||||
|
||||
var $loader = $(this).parents('.card').find('.loader');
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
if ($this.parent().hasClass('open')) {
|
||||
$this.parent().removeClass('open');
|
||||
$($this.parent().find('#item.'+ cat)).remove();
|
||||
} else {
|
||||
$loader.css('display','inline-block');
|
||||
$.ajax({
|
||||
url : '/' + page + '/' + cat + '/' + project_name, // La ressource ciblée
|
||||
type : 'GET', // Le type de la requête HTTP
|
||||
dataType:'html',
|
||||
success: function(data) {
|
||||
$('#item_list.'+cat+' .card-image.open #item').remove();
|
||||
$('#item_list.'+cat+' .card-image').removeClass('open');
|
||||
$(data).find('#item').addClass(cat).insertAfter($this);
|
||||
$this.parent().addClass('open');
|
||||
marg_item(project_name);
|
||||
anchor($href);
|
||||
lazy();
|
||||
scrollTop();
|
||||
|
||||
// ScrollReveal().reveal($('#item_list > .card'), {
|
||||
// duration: 1000,
|
||||
// distance: '10px',
|
||||
// });
|
||||
|
||||
},
|
||||
complete:function() {
|
||||
closeAjax();
|
||||
$('.loader').hide();
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function anchor($href) {
|
||||
|
||||
var aTag = $("#text_figli a[href='"+ $href +"']");
|
||||
console.log(aTag);
|
||||
// console.log('aTag.offset()', aTag.offset().top+10);
|
||||
$('html,body').animate({scrollTop: aTag.offset().top - 7},'slow');
|
||||
|
||||
}
|
||||
|
||||
function animate() {
|
||||
var $item_list = $('#item_list .card > .card-image');
|
||||
$item_list.fadeIn( "slow" );
|
||||
}
|
||||
|
||||
function marg_item(project_name) {
|
||||
|
||||
var $item = $('.card-image#'+project_name+' #item');
|
||||
var $card = $item.parents('.card');
|
||||
var pos_card = $card.offset().left-8;
|
||||
|
||||
$item.css('margin-left', '-'+pos_card +'px');
|
||||
|
||||
$(window).resize(function() {
|
||||
var pos_card = $card.offset().left-8;
|
||||
$item.css('margin-left', '-'+pos_card +'px');
|
||||
})
|
||||
}
|
||||
|
||||
function mouseHover() {
|
||||
|
||||
$link_cat = $('#text_figli p > a');
|
||||
|
||||
$link_cat.mouseenter(function() {
|
||||
link_id = $(this).attr("id");
|
||||
|
||||
$('html').append("<div class=circle_hover ></div>");
|
||||
// console.log('link_id',link_id);
|
||||
|
||||
setTimeout(function () {
|
||||
$('.circle_hover').addClass('open '+ link_id);
|
||||
}, 10);
|
||||
|
||||
mousePos();
|
||||
|
||||
})
|
||||
.mouseleave(function() {
|
||||
$('html').find(".circle_hover").remove();
|
||||
});
|
||||
|
||||
function mousePos() {
|
||||
var currentMousePos = { x: 0, y: 0 };
|
||||
var $circle = $('.circle_hover');
|
||||
|
||||
$(document).mousemove(function(event) {
|
||||
currentMousePos.x = event.pageX;
|
||||
currentMousePos.y = event.pageY;
|
||||
|
||||
$circle.css('left', currentMousePos.x );
|
||||
$circle.css('top', currentMousePos.y );
|
||||
});
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function lazy() {
|
||||
$('img.lazy').Lazy({
|
||||
effect: "fadeIn",
|
||||
effectTime: 500,
|
||||
threshold: 0
|
||||
});
|
||||
}
|
||||
|
||||
function animate_burger() {
|
||||
var forEach=function(t,o,r){if("[object Object]"===Object.prototype.toString.call(t))for(var c in t)Object.prototype.hasOwnProperty.call(t,c)&&o.call(r,t[c],c,t);else for(var e=0,l=t.length;l>e;e++)o.call(r,t[e],e,t)};
|
||||
var hamburgers = document.querySelectorAll(".hamburger");
|
||||
var $hamburger = $('button.hamburger');
|
||||
|
||||
if (hamburgers.length > 0) {
|
||||
forEach(hamburgers, function(hamburger) {
|
||||
hamburger.addEventListener("click", function() {
|
||||
this.classList.toggle("is-active");
|
||||
}, false);
|
||||
});
|
||||
}
|
||||
|
||||
$hamburger.click(function() {
|
||||
$('.sidebar-right').toggleClass("is-active");
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function closeAjax() {
|
||||
var $button = $('#item #icone_list');
|
||||
|
||||
$button.click(function() {
|
||||
$(this).parent().remove();
|
||||
$('.card-image').removeClass("open");
|
||||
});
|
||||
}
|
||||
|
||||
function croix() {
|
||||
var $link = $("#text_figli p > a");
|
||||
var hamburger = "<div id='icone_list'><button class='hamburger hamburger--slider is-active' type='button'><span class='hamburger-box'><span class='hamburger-inner'></span></span></button></div>"
|
||||
var loader = "<div class='loader'></div>"
|
||||
$link.append(hamburger);
|
||||
$link.append(loader);
|
||||
}
|
||||
|
||||
function scrollTop() {
|
||||
var $body = $("html, body");
|
||||
$('#item #top').click(function() {
|
||||
$body.stop().animate({scrollTop:0}, 500, 'swing', function() {
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
function imgmouse() {
|
||||
var currentMousePos = { x: 0, y: 0 };
|
||||
var $list_projets = $('.list-projets');
|
||||
var $img = $('.list-projets .img');
|
||||
|
||||
$list_projets.mousemove(function(e) {
|
||||
var pos = $list_projets.offset();
|
||||
|
||||
currentMousePos.x = e.pageX - pos.left ;
|
||||
currentMousePos.y = e.pageY - pos.top;
|
||||
|
||||
$img.css('left', currentMousePos.x );
|
||||
$img.css('top', currentMousePos.y );
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function scrollreveal() {
|
||||
var $txt = $('#text_figli p');
|
||||
|
||||
ScrollReveal().reveal($txt, {
|
||||
duration: 1000,
|
||||
distance: '10px',
|
||||
});
|
||||
}
|
||||
|
||||
function clickmenu() {
|
||||
var $menu = $('.sidebar-right button');
|
||||
|
||||
$menu.click(function() {
|
||||
$('#text_figli').toggleClass('hidden');
|
||||
$('html, body').toggleClass('hidden');
|
||||
});
|
||||
|
||||
var $list_projetsA = $('.list-projets .container');
|
||||
|
||||
$list_projetsA.click(function() {
|
||||
$('#text_figli').toggleClass('hidden');
|
||||
$('html, body').toggleClass('hidden');
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
function scrollcustom() {
|
||||
$(window).on("load",function(){
|
||||
// $(".sidebar-right").mCustomScrollbar({
|
||||
// scrollbarPosition: "outside",
|
||||
// axis:"y",
|
||||
// });
|
||||
//
|
||||
// $("body").mCustomScrollbar({
|
||||
// scrollbarPosition: "outside",
|
||||
// axis:"y",
|
||||
// });
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
$(document).ready(function($){
|
||||
scrollcustom();
|
||||
scrollreveal();
|
||||
click_link();
|
||||
click_list();
|
||||
mouseHover();
|
||||
animate_burger();
|
||||
croix();
|
||||
imgmouse();
|
||||
clickmenu();
|
||||
});
|
||||
Reference in New Issue
Block a user