Files
.github
config
database
docs
resources
assets
css
img
js
demos
demo-accounting-1.js
demo-app-landing.js
demo-architecture-2.js
demo-architecture-interior.js
demo-auto-services.js
demo-band.js
demo-barber.js
demo-beauty-salon.js
demo-business-consulting-2.js
demo-business-consulting-4.js
demo-business-consulting-5.js
demo-church.js
demo-cleaning-services.js
demo-construction-2.js
demo-creative-agency-1.js
demo-creative-agency-2.js
demo-dentist.js
demo-event.js
demo-gym.js
demo-hotel.js
demo-industry-factory.js
demo-it-services.js
demo-law-firm-2.js
demo-law-firm.js
demo-marketing-1.js
demo-medical.js
demo-one-page-agency.js
demo-personal-portfolio-1.js
demo-personal-portfolio-2.js
demo-personal-portfolio-3.js
demo-photography.js
demo-product-landing.js
demo-real-estate.js
demo-renewable-energy.js
demo-resume.js
demo-seo-2.js
demo-seo-3.js
demo-seo.js
demo-startup-agency.js
demo-transportation-logistic.js
demo-wedding.js
custom.js
theme.init.js
theme.js
templates
vendor
public
views
routes
src
.editorconfig
.gitattributes
.gitignore
.prettierignore
.prettierrc.json
CHANGELOG.md
CONTRIBUTING.md
CONVENTIONS.md
LICENSE
LICENSE.es.md
README.en.md
README.md
SECURITY.md
composer.json
laravel-vuexy-website-layou…/resources/assets/js/demos/demo-industry-factory.js
2025-05-30 03:09:08 -06:00

69 lines
1.5 KiB
JavaScript

/*
Name: Industry & Factory
Written by: Okler Themes - (http://www.okler.net)
Theme Version: 12.1.0
*/
(($ => {
/*
* SVG Aspect Ratio
*/
function aspectRatioSVG() {
if( $(window).width() < 2000 ) {
$('svg[preserveAspectRatio]:not(.custom-svg-btn-background)').each(function(){
$(this).attr('preserveAspectRatio', 'xMinYMin');
});
} else {
$('svg[preserveAspectRatio]:not(.custom-svg-btn-background)').each(function(){
$(this).attr('preserveAspectRatio', 'none');
});
}
}
aspectRatioSVG();
$(window).on('resize', () => {
aspectRatioSVG();
});
/*
* Play Video
*/
const $videoBox = $('.custom-featured-box-with-video');
$videoBox.find('.custom-trigger-play-video').on('click', function(e){
e.preventDefault();
const $this = $(this);
// Show Loading Dots
$this
.css('height', $this.outerHeight())
.html( '<div class="bounce-loader"><div class="bounce1"></div><div class="bounce2"></div><div class="bounce3"></div></div>' );
setTimeout(() => {
// Hide Video Poster
$videoBox
.find('.featured-box-background')
.addClass('hide');
// Hide Video Box Content
$videoBox
.find('.box-content')
.addClass('hide');
// Turn the video active
$videoBox
.find('.custom-featured-box-video')
.addClass('active');
// Play video
setTimeout(() => {
$videoBox
.find('.custom-featured-box-video')
.get(0)
.play();
}, 500);
}, 1000);
});
})).apply( this, [ jQuery ]);