Forum Replies Created
-
AuthorPosts
-
Hi Rikard
thanks for your feedback. I would appreciate if you could fix it, as the website is going to be overtaken by the owner in this week.Thanks and best regards
Michael F Krausstill one more question. What do I have to do here:
jQuery Migrate Helper
Im Moment verwendest du ein Plugin zur Unterstützung von etwas altem Code in der jQuery JavaScript-Bibliothek dieser Website. Dieser Code ist veraltet, d.h. er ist im Grunde genommen überholt und verliert den Support deiner Themes und Plugins sowie von WordPress selbst.
Dieses Plugin namens „Enable jQuery Migrate Helper“ stellt keine Fehlerbehebung dar. Es ist eine vorübergehende Lösung, um den Autoren deiner Plugins und Themes Zeit für eine Aktualisierung zu geben.
Wenn du Warnungen erhältst, überprüfe bitte, ob es aktualisierte Versionen des Plugins oder Themes gibt, das die Warnung erzeugt hat. Es wird sehr wahrscheinlich eine geben, die du installieren kannst. Wenn du deine Plugins und Themes aktualisiert hast und es keine Warnungen mehr gibt, deaktiviere bitte auch Enable jQuery Migrate Helper.
Du benutzt momentan eine veraltete Version von jQuery. Diese wird nicht länger unterstützt und erhält keine Sicherheitsaktualisierungen. Bitte führe so schnell wie möglich ein Upgrade durch.Thanks Rikard,
this solution helped and solved the problem!!!Best regards
Michael F KrausJanuary 20, 2021 at 6:43 pm in reply to: Search symbol shows only headline but not the searched context #1274157hi Ismael,
sorry, kept you waiting. Where do I finde the excerpt. box or the Screen options?
Best regards
Michael FHi Rikard, Thanks for your response!
I am using a child theme. Anything I have to take care for?Best Regards
Michael FHi Ismael.
I am sure somebody will be able to translate the few German words I am using here ;-)
… you are quite right with one exception.
The “DSGVO” wants you to put a “Häckchen” OK-Sign and a link to the “Datenschutzerklärung” in a E-Mail-Form (where sensible Data is send) you confirm that you have read the “Datenschutzerklärung”.
The DSGVO wants you to shorten the IP-Adress when using Google Analytics.
But when leaving a comment the user gives his full IP and the name of the provider to the Webhoster (and also will receive a Mail with this content), and that is, according to our “Datenschutzbeauftragter” not correct. At this place there should also be an information with a link to the “Datenschutzerklärung”
And the DSGVO wants me – as the provider of the website – to be able to export all the given Information by the user and in special case I also have to delete this information.I know the “DSGVO” is rather a young law and we will all have to learn a lot more about it. Maybe we should think web-responsibility new and find solutions to make us Webdesigners and webhoster safer facing the “DSGVO”.
Hope not to bother you too much
Michael F. Kraus
Hi Ismael!
Thanks for your answer, but my question was: Is the collecting of the server log files conform with the DSGVO? ;-)
I Mean if your are using Analytic-Tools your are asked to cut of the last three numbers of the ip an here in the comments we collect the hole ip?!I have read your article https://kriesi.at/archives/enfold-4-4-and-the-gdpr-general-data-protection-regulation but didn’t find my answer.
Pleas provide me further information. thanks to you
Best regards
Michael F KrausHi Rikard,
Maybe i didn‘t get it right explained: even if no plugins are in use (and none of them needs an update) i still get the information that 1 Plugin needs an update …
Hi Guenni007!
Thank a lot for your assistence to the code. Now i am working on the responisve side of the website an get this “error” for the frontpage video:
Would you please take a look. We need the video for tablet and smartphoneThanks a lot
Michael F. KrausHi Yigit!
I have the same problem: disable emojis!
I tried with plugin – doesn’t work
I tried to find Enfold theme options > Performance – does not exist in my (Child-) Theme.Any other solution?
This reply has been marked as private.… and here is the video on youtube. https://youtu.be/zPWBPhsq4pM
Hi there,
still having the problem with the jumping picture. Please see the video: https://mm-strategies.com/wp-content/uploads/2018/09/Zeilensprung-1.movSeptember 19, 2018 at 9:02 am in reply to: enfold change background color in video slideshow #1011661Perfect!!!
Developer Option solved all!
Thanks to you !September 19, 2018 at 6:59 am in reply to: enfold change background color in video slideshow #1011626Hi Guenni,
hey thanks for this input! i tried to paste the code into functions.php in the childtheme but i get an error:
I pasted it now per FTP, that worked, but the result is different to yours:
I can`t give to the code-block element a custom-class: fullvideo
- This reply was modified 6 years, 2 months ago by werbeagenturlauf.
September 18, 2018 at 12:35 pm in reply to: enfold change background color in video slideshow #1011228OK I’ll speak English now ;-)
My problem is that in the headline Rotator the amount of text is very individual. Sometimes one row, sometimes two or three rows and that makes the following pictures and text jump.I am using the Plugin wpml for translations and the html code to make a empty row or a return does not work probably. I use <br> and <b /> but it is not accepted.
This reply has been marked as private.Works fine. Thanks, again, for your help!!!
This reply has been marked as private.This reply has been marked as private.Hi Rikard,
yes i am trying to hide the header completely. But doesn’t work.
what i want to achieve: just the big picture. No Logo. No Menue.
thanks for helo
Michael F Kraus
This reply has been marked as private.This reply has been marked as private.July 16, 2018 at 11:44 am in reply to: Mobile shows object object instead of fallback picture #985901Hi Victoria,
have your Developers found a clean Solution for this Problem yet? Please give me a Feedback. Thanks
Michael FHi Basilis,
you mean replace the whole above text by Victorias text?
My mistake. I thought 404 is the same like „nothing found“!!!
Please try again using the wpml flags in the right cornerHi Victoria!
I have two problems:
1.
I am working with a child theme. and as far as i know with the next update of the theme this might be overwritten.2.
Do i overwrite all this?:/* ======================================================================================================================================================
Avia Slideshow
====================================================================================================================================================== */(function($)
{
“use strict”;$.AviaSlider = function(options, slider)
{
var self = this;this.$win = $( window );
this.$slider = $( slider );
this.isMobile = $.avia_utilities.isMobile;
this._prepareSlides(options);
//default preload images then init slideshow
$.avia_utilities.preload({container: this.$slider , single_callback: function(){ self._init( options ); }});
}$.AviaSlider.defaults = {
//interval between autorotation switches
interval:5,//autorotation active or not
autoplay:false,//set if the loop will stop at the last/first slide or if the slides will loop infinite
//set to false for infinite loop, “last” to stop at the last slide or “first” to stop at the first slide
stopinfiniteloop: false,//fade or slide animation
animation:’slide’,//transition speed when switching slide
transitionSpeed:900,//easing method for the transition
easing:’easeInOutQuart’,//slide wrapper
wrapElement: ‘>ul’,//slide element
slideElement: ‘>li’,//pause if mouse cursor is above item
hoverpause: false,//attach images as background
bg_slider: false,//delay of miliseconds to wait before showing the next slide
show_slide_delay: 0,//if slider animation is set to “fade” the fullfade property sets the crossfade behaviour
fullfade: false,//enable carousel mode with multiple visible slides
carousel: ‘no’,// how many slides are displayed at once in the carousel
carouselSlidesToShow: 3,// TODO: how many slides are scrolled in the carousel
carouselSlidesToScroll: 1,// responsive carousel
carouselResponsive : new Array(),};
$.AviaSlider.prototype =
{
_init: function( options )
{
// set slider options
this.options = this._setOptions(options);//slidewrap
this.$sliderUl = this.$slider.find(this.options.wrapElement);// slide elements
this.$slides = this.$sliderUl.find(this.options.slideElement);// goto dots
this.gotoButtons = this.$slider.find(‘.avia-slideshow-dots a’);//perma caption
this.permaCaption = this.$slider.find(‘>.av-slideshow-caption’);// slide count
this.itemsCount = this.$slides.length;// current image index
this.current = 0;// current carousel index
this.currentCarousel = 0;// carousel slide width
this.slideWidthCarousel = ‘240’;//loop count
this.loopCount = 0;// control if the slicebox is animating
this.isAnimating = false;// css browser prefix like -webkit-, -moz-
this.browserPrefix = $.avia_utilities.supports(‘transition’);// css3 animation?
this.cssActive = this.browserPrefix !== false ? true : false;// css3D animation?
this.css3DActive = document.documentElement.className.indexOf(‘avia_transform3d’) !== -1 ? true : false;//store the aviaVideoApi object for the current slide if available
this.video = false;//if we have a bg slider no images were preloaded yet. in that case start preloading and attaching images
if(this.options.bg_slider == true)
{
//create array that holds all image urls to preload
this.imageUrls = [];//create a preloader icon to indicate loading
this.loader = $.avia_utilities.loading(this.$slider);//preload the images ony by one
this._bgPreloadImages();}
else //if it was a default slider all images are already loaded and we can start showing the slider
{
//kickoff the slider: bind functions, show first slide, if active start the autorotation timer
this._kickOff();
}if(this.options.carousel === ‘yes’){
this.options.animation = ‘carouselslide’;
}
},//set the slider options by first merging the efault options and the passed options, then checking the slider element if any data attributes overwrite the option set
_setOptions: function(options)
{
var newOptions = $.extend( true, {}, $.AviaSlider.defaults, options ),
htmlData = this.$slider.data(),
i = “”;//overwritte passed option set with any data properties on the html element
for (i in htmlData)
{
if (htmlData.hasOwnProperty(i))
{
if(typeof htmlData[i] === “string” || typeof htmlData[i] === “number” || typeof htmlData[i] === “boolean”)
{
newOptions[i] = htmlData[i];
}
}
}return newOptions;
},_prepareSlides: function(options)
{
//if its a mobile device find all video slides that need to be altered
if(this.isMobile)
{
var alter = this.$slider.find(‘.av-mobile-fallback-image’);
alter.each(function()
{
var current = $(this).removeClass(‘av-video-slide’).data({‘avia_video_events’: true, ‘video-ratio’:0}),
fallback = current.data(‘mobile-img’),
fallback_link = current.data(‘fallback-link’),
appendTo = current.find(‘.avia-slide-wrap’);current.find(‘.av-click-overlay, .mejs-mediaelement, .mejs-container’).remove();
if(!fallback)
{
$(‘<p class=”av-fallback-message”><span>Please set a mobile device fallback image for this video in your wordpress backend</span></p>’).appendTo(appendTo);
}if(options && options.bg_slider)
{
current.data(‘img-url’, fallback);//if we got a fallback link we need to either replace the default link on mobile devices, or if there is no default link change the wrapping <div> to an
if(fallback_link != “”)
{
if(appendTo.is(‘a’))
{
appendTo.attr(‘href’, fallback_link);
}
else
{
appendTo.find(‘a’).remove();
appendTo.replaceWith(function(){
var cur_slide = $(this);
return $(““).attr({‘data-rel’: cur_slide.data(‘rel’), ‘class’: cur_slide.attr(‘class’), ‘href’: fallback_link} ).append( $(this).contents() );
});appendTo = current.find(‘.avia-slide-wrap’);
}if($.fn.avia_activate_lightbox)
{
current.parents(‘#main’).avia_activate_lightbox();
}
}
}
else
{
var image = $(‘‘);
var lightbox = false;if( ‘string’ == typeof fallback_link && fallback_link.trim() != ” )
{
image = $(‘‘ + image + ‘‘);
lightbox = true;
}if( lightbox && $.fn.avia_activate_lightbox)
{
current.parents(‘#main’).avia_activate_lightbox();
}current.find(‘.avia-slide-wrap’).append(image);
}});
}},
//start preloading the background images
_bgPreloadImages : function(callback)
{
this._getImageURLS();this._preloadSingle(0, function()
{
this._kickOff();
this._preloadNext(1);
});
},//if we are using a background image slider, fetch the images from a data attribute and preload them one by one
_getImageURLS: function()
{
var _self = this;//collect url strings of the images to preload
this.$slides.each(function(i)
{
_self.imageUrls[i] = [];
_self.imageUrls[i][‘url’] = $(this).data(“img-url”);//if no image is passed we can set the slide to loaded
if(typeof _self.imageUrls[i][‘url’] == ‘string’)
{
_self.imageUrls[i][‘status’] = false;
}
else
{
_self.imageUrls[i][‘status’] = true;
}
});
},_preloadSingle: function(key, callback)
{
var _self = this,
objImage = new Image();if(typeof _self.imageUrls[key][‘url’] == ‘string’)
{
$(objImage).bind(‘load error’, function()
{
_self.imageUrls[key][‘status’] = true;
_self.$slides.eq(key).css(‘background-image’,’url(‘ + _self.imageUrls[key][‘url’] + ‘)’);
if(typeof callback == ‘function’) callback.apply( _self, [objImage, key] );
});if(_self.imageUrls[key][‘url’] != “”)
{
objImage.src = _self.imageUrls[key][‘url’];
}
else
{
$(objImage).trigger(‘error’);
}
}
else
{
if(typeof callback == ‘function’) callback.apply( _self, [objImage, key] );
}
},_preloadNext: function(key)
{
if(typeof this.imageUrls[key] != “undefined”)
{
this._preloadSingle(key, function()
{
this._preloadNext(key + 1);
});
}
},//bind click events of slide controlls to the public functions
_bindEvents: function()
{
var self = this,
win = $( window );this.$slider.on(‘click’,’.next-slide’, $.proxy( this.next, this) );
this.$slider.on(‘click’,’.prev-slide’, $.proxy( this.previous, this) );
this.$slider.on(‘click’,’.goto-slide’, $.proxy( this.go2, this) );if(this.options.hoverpause)
{
this.$slider.on(‘mouseenter’, $.proxy( this.pause, this) );
this.$slider.on(‘mouseleave’, $.proxy( this.resume, this) );
}if(this.options.stopinfiniteloop && this.options.autoplay)
{
if(this.options.stopinfiniteloop == ‘last’)
{
this.$slider.on(‘avia_slider_last_slide’, $.proxy(this._stopSlideshow, this) );
}
else if(this.options.stopinfiniteloop == ‘first’)
{
this.$slider.on(‘avia_slider_first_slide’, $.proxy(this._stopSlideshow, this) );
}
}if (this.options.carousel === ‘yes’){
// recalculate carousel dimensions on viewport size change
win.on( ‘debouncedresize’, $.proxy( this._buildCarousel, this) );
}
else{
win.on( ‘debouncedresize.aviaSlider’, $.proxy( this._setSize, this) );
}//if its a desktop browser add arrow navigation, otherwise add touch nav
if(!this.isMobile)
{
this.$slider.avia_keyboard_controls();
}
else
{
this.$slider.avia_swipe_trigger();
}self._attach_video_events();
},//kickoff the slider by binding all functions to slides and buttons, show the first slide and start autoplay
_kickOff: function()
{
var self = this,
first_slide = self.$slides.eq(0),
video = first_slide.data(‘video-ratio’);// bind events to to the controll buttons
self._bindEvents();this.$slider.removeClass(‘av-default-height-applied’);
//show the first slide. if its a video set the correct size, otherwise make sure to remove the % padding
if(video)
{
self._setSize(true);
}
else
{
if(this.options.keep_pading != true)
{
self.$sliderUl.css(‘padding’,0);
self.$win.trigger(‘av-height-change’);
}
}self._setCenter();
if ( this.options.carousel === ‘no’ ) {
first_slide.css({visibility:’visible’, opacity:0}).avia_animate({opacity:1}, function()
{
var current = $(this).addClass(‘active-slide’);if(self.permaCaption.length)
{
self.permaCaption.addClass(‘active-slide’);
}
});
}// start autoplay if active
if( self.options.autoplay )
{
self._startSlideshow();
}// prepare carousel if active
if (self.options.carousel === ‘yes’) {
self._buildCarousel();
}self.$slider.trigger(‘_kickOff’);
},
_buildCarousel : function(){
var self = this,
stageWidth = this.$slider.outerWidth(),
slidesWidth = parseInt(stageWidth / this.options.carouselSlidesToShow),
windowWidth = window.innerWidth || $(window).width();// responsive carousel
if ( this.options.carouselResponsive &&
this.options.carouselResponsive.length &&
this.options.carouselResponsive !== null) {for (var breakpoint in this.options.carouselResponsive){
var breakpointValue = this.options.carouselResponsive[breakpoint][‘breakpoint’];
var newSlidesToShow = this.options.carouselResponsive[breakpoint][‘settings’][‘carouselSlidesToShow’];if (breakpointValue >= windowWidth) {
slidesWidth = parseInt(stageWidth / newSlidesToShow);
this.options.carouselSlidesToShow = newSlidesToShow;
}
}
}// set width and height for each slide
this.slideWidthCarousel = slidesWidth;this.$slides.each(function(i){
$(this).width(slidesWidth);
});// set width for the UL
var slideTrackWidth = slidesWidth * this.itemsCount;
this.$sliderUl.width(slideTrackWidth).css(‘transform’, ‘translateX(0px)’);// hide nav if not needed
if (this.options.carouselSlidesToShow >= this.itemsCount){
this.$slider.find(‘.av-timeline-nav’).hide();
}},
//calculate which slide should be displayed next and call the executing transition function
_navigate : function( dir, pos ) {if( this.isAnimating || this.itemsCount < 2 || !this.$slider.is(“:visible”) )
{
return false;
}this.isAnimating = true;
// current item’s index
this.prev = this.current;// if position is passed
if( pos !== undefined )
{
this.current = pos;
dir = this.current > this.prev ? ‘next’ : ‘prev’;
}// if not check the boundaries
else if( dir === ‘next’ )
{
this.current = this.current < this.itemsCount – 1 ? this.current + 1 : 0;if( this.current === 0 && this.options.autoplay_stopper == 1 && this.options.autoplay )
{
this.isAnimating = false;
this.current = this.prev;
this._stopSlideshow();
return false;
}
}
else if( dir === ‘prev’ )
{
this.current = this.current > 0 ? this.current – 1 : this.itemsCount – 1;
}//set goto button
this.gotoButtons.removeClass(‘active’).eq(this.current).addClass(‘active’);//set slideshow size if carousel not in use
if( this.options.carousel === ‘no’) {
this._setSize();
}//if we are using a background slider make sure that the image is loaded. if not preload it, then show the slide
if(this.options.bg_slider == true)
{
if(this.imageUrls[this.current][‘status’] == true )
{
this[‘_’ + this.options.animation].call(this, dir);
}
else
{
this.loader.show();
this._preloadSingle(this.current, function()
{
this[‘_’ + this.options.animation].call(this, dir);
this.loader.hide();
});
}
}
else //no background loader -> images are already loaded
{
//call the executing function. for example _slide, or _fade. since the function call is absed on a var we can easily extend the slider with new animations
this[‘_’ + this.options.animation].call(this, dir);
}if(this.current == 0)
{
this.loopCount++;
this.$slider.trigger(‘avia_slider_first_slide’);
}
else if(this.current == this.itemsCount – 1)
{
this.$slider.trigger(‘avia_slider_last_slide’);
}
else
{
this.$slider.trigger(‘avia_slider_navigate_slide’);
}
},//if the next slide has a different height than the current change the slideshow height
_setSize: function(instant)
{
//if images are attached as bg images the slider has a fixed height
if(this.options.bg_slider == true) return;var self = this,
slide = this.$slides.eq(this.current),
img = slide.find(‘img’),
current = Math.floor(this.$sliderUl.height()),
ratio = slide.data(‘video-ratio’),
setTo = ratio ? this.$sliderUl.width() / ratio : Math.floor(slide.height()),
video_height = slide.data(‘video-height’), //forced video height %. needs to be set only once
video_toppos = slide.data(‘video-toppos’); //forced video top positionthis.$sliderUl.height(current).css(‘padding’,0); //make sure to set the slideheight to an actual value
if(setTo != current)
{
if(instant == true)
{
this.$sliderUl.css({height:setTo});
this.$win.trigger(‘av-height-change’);
}
else
{
this.$sliderUl.avia_animate({height:setTo}, function()
{
self.$win.trigger(‘av-height-change’);
});
}
}this._setCenter();
if(video_height && video_height!= “set”)
{
slide.find(‘iframe, embed, video, object, .av_youtube_frame’).css({height: video_height + ‘%’, top: video_toppos + ‘%’});
slide.data(‘video-height’,’set’);
}
},_setCenter: function()
{
//if the image has a min width and is larger than the slider center it
//positon img based on caption. right caption->left pos, left caption -> right pos
var slide = this.$slides.eq(this.current),
img = slide.find(‘img’),
min_width = parseInt(img.css(‘min-width’),10),
slide_width = slide.width(),
caption = slide.find(‘.av-slideshow-caption’),
css_left = ((slide_width – min_width) / 2);if(caption.length)
{
if(caption.is(‘.caption_left’))
{
css_left = ((slide_width – min_width) / 1.5);
}
else if(caption.is(‘.caption_right’))
{
css_left = ((slide_width – min_width) / 2.5);
}
}if(slide_width >= min_width)
{
css_left = 0;
}img.css({left:css_left});
},_carouselmove : function(){
// var offset = (this.options.carouselSlidesToScroll*this.slideWidthCarousel)*this.currentCarousel;
var offset = this.slideWidthCarousel*this.currentCarousel;
this.$sliderUl.css(‘transform’, ‘translateX(-‘+offset+’px)’);},
_carouselslide: function(dir){
if (dir === ‘next’) {
if (this.options.carouselSlidesToShow + this.currentCarousel < this.itemsCount){
this.currentCarousel++;
this._carouselmove();
}
}
else if (dir === ‘prev’){
if (this.currentCarousel > 0) {
this.currentCarousel–;
this._carouselmove();
}
}this.isAnimating = false;
},
_slide: function(dir)
{
var dynamic = false, //todo: pass by option if a slider is dynamic
modifier = dynamic == true ? 2 : 1,
sliderWidth = this.$slider.width(),
direction = dir === ‘next’ ? -1 : 1,
property = this.browserPrefix + ‘transform’,
reset = {}, transition = {}, transition2 = {},
trans_val = ( sliderWidth * direction * -1),
trans_val2 = ( sliderWidth * direction) / modifier;//do a css3 animation
if(this.cssActive)
{
property = this.browserPrefix + ‘transform’;//do a translate 3d transformation if available, since it uses hardware acceleration
if(this.css3DActive)
{
reset[property] = “translate3d(” + trans_val + “px, 0, 0)”;
transition[property] = “translate3d(” + trans_val2 + “px, 0, 0)”;
transition2[property] = “translate3d(0,0,0)”;
}
else //do a 2d transform. still faster than a position “left” change
{
reset[property] = “translate(” + trans_val + “px,0)”;
transition[property] = “translate(” + trans_val2 + “px,0)”;
transition2[property] = “translate(0,0)”;
}
}
else
{
reset.left = trans_val;
transition.left = trans_val2;
transition2.left = 0;
}if(dynamic)
{
transition[‘z-index’] = “1”;
transition2[‘z-index’] = “2”;
}this._slide_animate(reset, transition, transition2);
},_slide_up: function(dir)
{
var dynamic = true, //todo: pass by option if a slider is dynamic
modifier = dynamic == true ? 2 : 1,
sliderHeight = this.$slider.height(),
direction = dir === ‘next’ ? -1 : 1,
property = this.browserPrefix + ‘transform’,
reset = {}, transition = {}, transition2 = {},
trans_val = ( sliderHeight * direction * -1),
trans_val2 = ( sliderHeight * direction) / modifier;//do a css3 animation
if(this.cssActive)
{
property = this.browserPrefix + ‘transform’;//do a translate 3d transformation if available, since it uses hardware acceleration
if(this.css3DActive)
{
reset[property] = “translate3d( 0,” + trans_val + “px, 0)”;
transition[property] = “translate3d( 0,” + trans_val2 + “px, 0)”;
transition2[property] = “translate3d(0,0,0)”;
}
else //do a 2d transform. still faster than a position “left” change
{
reset[property] = “translate( 0,” + trans_val + “px)”;
transition[property] = “translate( 0,” + trans_val2 + “px)”;
transition2[property] = “translate(0,0)”; }
}
else
{
reset.top = trans_val;
transition.top = trans_val2;
transition2.top = 0;
}if(dynamic)
{
transition[‘z-index’] = “1”;
transition2[‘z-index’] = “2”;
}
this._slide_animate(reset, transition, transition2);
},//slide animation: do a slide transition by css3 transform if possible. if not simply do a position left transition
_slide_animate: function( reset , transition , transition2 )
{var self = this,
displaySlide = this.$slides.eq(this.current),
hideSlide = this.$slides.eq(this.prev);hideSlide.trigger(‘pause’);
if( !displaySlide.data(‘disableAutoplay’) ) displaySlide.trigger(‘play’);displaySlide.css({visibility:’visible’, zIndex:4, opacity:1, left:0, top:0});
displaySlide.css(reset);hideSlide.avia_animate(transition, this.options.transitionSpeed, this.options.easing);
var after_slide = function()
{
self.isAnimating = false;
displaySlide.addClass(‘active-slide’);
hideSlide.css({visibility:’hidden’}).removeClass(‘active-slide’);
self.$slider.trigger(‘avia-transition-done’);
}if(self.options.show_slide_delay > 0)
{
setTimeout(function() { displaySlide.avia_animate(transition2, self.options.transitionSpeed, self.options.easing, after_slide); },self.options.show_slide_delay);
}
else
{
displaySlide.avia_animate(transition2, self.options.transitionSpeed, self.options.easing, after_slide);
}},
//simple fade transition of the slideshow
_fade: function()
{
var self = this,
displaySlide = this.$slides.eq(this.current),
hideSlide = this.$slides.eq(this.prev),
properties = {visibility:’visible’, zIndex:3, opacity:0},
fadeCallback = function()
{
self.isAnimating = false;
displaySlide.addClass(‘active-slide’);
hideSlide.css({visibility:’hidden’, zIndex:2}).removeClass(‘active-slide’);
self.$slider.trigger(‘avia-transition-done’);};
hideSlide.trigger(‘pause’);
if( !displaySlide.data(‘disableAutoplay’) ) displaySlide.trigger(‘play’);if(self.options.fullfade == true)
{
hideSlide.avia_animate({opacity:0}, 200, ‘linear’, function()
{
displaySlide.css(properties).avia_animate({opacity:1}, self.options.transitionSpeed, ‘linear’,fadeCallback);
});
}
else
{
displaySlide.css(properties).avia_animate({opacity:1}, self.options.transitionSpeed/2, ‘linear’, function()
{
hideSlide.avia_animate({opacity:0}, 200, ‘linear’, fadeCallback);
});
}},
/************************************************************************
Video functions
*************************************************************************///bind events to the video that tell the slider to autorotate once a video has been played
_attach_video_events: function()
{
var self = this, $html = $(‘html’);self.$slides.each(function(i)
{
var currentSlide = $(this),
caption = currentSlide.find(‘.caption_fullwidth, .av-click-overlay’),
mejs = currentSlide.find(‘.mejs-mediaelement’);if(currentSlide.data(‘avia_video_events’) != true)
{
currentSlide.data(‘avia_video_events’, true);currentSlide.on(‘av-video-events-bound’, { slide: currentSlide, wrap: mejs , iteration: i , self: self }, onReady);
currentSlide.on(‘av-video-ended’, { slide: currentSlide , self: self}, onFinish);
currentSlide.on(‘av-video-play-executed’, function(){ setTimeout(function(){ self.pause() }, 100); });
caption.on(‘click’, { slide: currentSlide }, toggle);
// also if the player was loaded before the _bindEvents function was bound trigger it manually
if(currentSlide.is(‘.av-video-events-bound’)) currentSlide.trigger(‘av-video-events-bound’);
}
});//helper functions
function onReady( event )
{
//autostart for first slide
if(event.data.iteration === 0)
{
event.data.wrap.css(‘opacity’,0);
if(!event.data.self.isMobile && !event.data.slide.data(‘disableAutoplay’))
{
event.data.slide.trigger(‘play’);
}
setTimeout(function(){ event.data.wrap.avia_animate({opacity:1}, 400); }, 50);
}
else if ($html.is(‘.avia-msie’) && !event.data.slide.is(‘.av-video-service-html5’))
{
/*
* Internet Explorer fires the ready event for external videos once they become visible
* as oposed to other browsers which always fire immediately.
*/
if( !event.data.slide.data(‘disableAutoplay’) ) event.data.slide.trigger(‘play’);
}}
function onFinish( event )
{
//if the video is not looped resume the slideshow
if(!event.data.slide.is(‘.av-single-slide’) && !event.data.slide.is(‘.av-loop-video’))
{
event.data.slide.trigger(‘reset’);
self._navigate( ‘next’ );
self.resume();
}//safari 8 workaround for self hosted videos which wont loop by default
if(event.data.slide.is(‘.av-loop-video’) && event.data.slide.is(‘.av-video-service-html5’))
{
if($html.is(‘.avia-safari-8’))
{
setTimeout(function(){ event.data.slide.trigger(‘play’); },1);
}
}
}function toggle( event )
{
if(event.target.tagName != “A”)
{
event.data.slide.trigger(‘toggle’);
}
}},
/************************************************************************
Slideshow control functions
*************************************************************************/_timer: function(callback, delay, first)
{
var self = this, start, remaining = delay;self.timerId = 0;
this.pause = function() {
window.clearTimeout(self.timerId);
remaining -= new Date() – start;
};this.resume = function() {
start = new Date();
self.timerId = window.setTimeout(callback, remaining);
};this.destroy = function()
{
window.clearTimeout(self.timerId);
};this.resume(true);
},//start autorotation
_startSlideshow: function()
{
var self = this;this.isPlaying = true;
this.slideshow = new this._timer( function()
{
/*
var videoApi = self.$slides.eq(self.current).data(‘aviaVideoApi’)
if(!videoApi){}
*/self._navigate( ‘next’ );
if ( self.options.autoplay )
{
self._startSlideshow();
}}, (this.options.interval * 1000));
},//stop autorotation
_stopSlideshow: function()
{
if ( this.options.autoplay ) {this.slideshow.destroy();
this.isPlaying = false;
this.options.autoplay = false;
}
},// public method: shows next image
next : function(e)
{
e.preventDefault();
this._stopSlideshow();
this._navigate( ‘next’ );
},// public method: shows previous image
previous : function(e)
{
e.preventDefault();
this._stopSlideshow();
this._navigate( ‘prev’ );
},// public method: goes to a specific image
go2 : function( pos )
{
//if we didnt pass a number directly lets asume someone clicked on a link that triggered the goto transition
if(isNaN(pos))
{
//in that case prevent the default link behavior and set the slide number to the links hash
pos.preventDefault();
pos = pos.currentTarget.hash.replace(‘#’,”);
}pos -= 1;
if( pos === this.current || pos >= this.itemsCount || pos < 0 )
{
return false;
}this._stopSlideshow();
this._navigate( false, pos );},
// public method: starts the slideshow
// any call to next(), previous() or goto() will stop the slideshow autoplay
play : function()
{
if( !this.isPlaying )
{
this.isPlaying = true;this._navigate( ‘next’ );
this.options.autoplay = true;
this._startSlideshow();
}},
// public methos: pauses the slideshow
pause : function()
{
if( this.isPlaying )
{
this.slideshow.pause();
}
},// publiccmethos: resumes the slideshow
resume : function()
{
if( this.isPlaying )
{
this.slideshow.resume();
}
},// public methos: destroys the instance
destroy : function( callback )
{
this.slideshow.destroy( callback );
}}
//simple wrapper to call the slideshow. makes sure that the slide data is not applied twice
$.fn.aviaSlider = function( options )
{
return this.each(function()
{
var self = $.data( this, ‘aviaSlider’ );if(!self)
{
self = $.data( this, ‘aviaSlider’, new $.AviaSlider( options, this ) );
}
});
}})( jQuery );
Thanks again for your help!
Michael F.
Thanks to you Nikko,
Both Problems solved!
-
AuthorPosts