Updated the carousel.
This commit is contained in:
parent
1090ae156e
commit
535ba1ad32
2 changed files with 3 additions and 71 deletions
|
@ -164,74 +164,6 @@
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
|
||||||
* Skills animation
|
|
||||||
*/
|
|
||||||
let skilsContent = select('.skills-content');
|
|
||||||
if (skilsContent) {
|
|
||||||
new Waypoint({
|
|
||||||
element: skilsContent,
|
|
||||||
offset: '80%',
|
|
||||||
handler: function(direction) {
|
|
||||||
let progress = select('.progress .progress-bar', true);
|
|
||||||
progress.forEach((el) => {
|
|
||||||
el.style.width = el.getAttribute('aria-valuenow') + '%'
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Porfolio isotope and filter
|
|
||||||
*/
|
|
||||||
window.addEventListener('load', () => {
|
|
||||||
let portfolioContainer = select('.portfolio-container');
|
|
||||||
if (portfolioContainer) {
|
|
||||||
let portfolioIsotope = new Isotope(portfolioContainer, {
|
|
||||||
itemSelector: '.portfolio-item',
|
|
||||||
layoutMode: 'fitRows'
|
|
||||||
});
|
|
||||||
|
|
||||||
let portfolioFilters = select('#portfolio-flters li', true);
|
|
||||||
|
|
||||||
on('click', '#portfolio-flters li', function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
portfolioFilters.forEach(function(el) {
|
|
||||||
el.classList.remove('filter-active');
|
|
||||||
});
|
|
||||||
this.classList.add('filter-active');
|
|
||||||
|
|
||||||
portfolioIsotope.arrange({
|
|
||||||
filter: this.getAttribute('data-filter')
|
|
||||||
});
|
|
||||||
}, true);
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Initiate portfolio lightbox
|
|
||||||
*/
|
|
||||||
const portfolioLightbox = GLightbox({
|
|
||||||
selector: '.portfolio-lightbox'
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Portfolio details slider
|
|
||||||
*/
|
|
||||||
new Swiper('.portfolio-details-slider', {
|
|
||||||
speed: 400,
|
|
||||||
autoplay: {
|
|
||||||
delay: 5000,
|
|
||||||
disableOnInteraction: false
|
|
||||||
},
|
|
||||||
pagination: {
|
|
||||||
el: '.swiper-pagination',
|
|
||||||
type: 'bullets',
|
|
||||||
clickable: true
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Initiate Pure Counter
|
* Initiate Pure Counter
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -34,7 +34,7 @@
|
||||||
<!-- ======= Hero Section ======= -->
|
<!-- ======= Hero Section ======= -->
|
||||||
<section id="hero">
|
<section id="hero">
|
||||||
<div class="hero-container">
|
<div class="hero-container">
|
||||||
<div id="heroCarousel" class="carousel slide carousel-fade" data-bs-ride="carousel" data-bs-interval="5000">
|
<div id="heroCarousel" class="carousel slide carousel-fade" data-bs-interval="false">
|
||||||
|
|
||||||
<ol class="carousel-indicators" id="hero-carousel-indicators"></ol>
|
<ol class="carousel-indicators" id="hero-carousel-indicators"></ol>
|
||||||
|
|
||||||
|
@ -56,7 +56,7 @@
|
||||||
<div class="carousel-content">
|
<div class="carousel-content">
|
||||||
<h2 class="animate__animated animate__fadeInDown">Batuhan Basoglu's Personal Website</h2>
|
<h2 class="animate__animated animate__fadeInDown">Batuhan Basoglu's Personal Website</h2>
|
||||||
<p class="animate__animated animate__fadeInUp">Batuhan Basoglu's personal portfolio website to introduce his work and projects to the people. It is made with HTML, CSS and Javascript</p>
|
<p class="animate__animated animate__fadeInUp">Batuhan Basoglu's personal portfolio website to introduce his work and projects to the people. It is made with HTML, CSS and Javascript</p>
|
||||||
<a href="https://batuhan.basoglu.co" class="btn-get-started animate__animated animate__fadeInUp scrollto">Visit the Website</a>
|
<a href="https://batuhan.basoglu.co" target="_blank" class="btn-get-started animate__animated animate__fadeInUp scrollto">Visit the Website</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -67,7 +67,7 @@
|
||||||
<div class="carousel-content">
|
<div class="carousel-content">
|
||||||
<h2 class="animate__animated animate__fadeInDown">Batuhan Basoglu's Personal Blog</h2>
|
<h2 class="animate__animated animate__fadeInDown">Batuhan Basoglu's Personal Blog</h2>
|
||||||
<p class="animate__animated animate__fadeInUp">Batuhan Basoglu's personal blog to talk about his views on technology, as well as sharing news and trends in the field. It is made with PHP, HTML, CSS and Javascript</p>
|
<p class="animate__animated animate__fadeInUp">Batuhan Basoglu's personal blog to talk about his views on technology, as well as sharing news and trends in the field. It is made with PHP, HTML, CSS and Javascript</p>
|
||||||
<a href="https://arcticpress.basoglu.co" class="btn-get-started animate__animated animate__fadeInUp scrollto">Visit the Website</a>
|
<a href="https://arcticpress.basoglu.co" target="_blank" class="btn-get-started animate__animated animate__fadeInUp scrollto">Visit the Website</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue