"Text animation vertical with no filter" doesn't work correctly in Edge browser

SilverOne — Sat, 29 Aug 2015 06:20:19 +0000

The new IE Edge browser that comes as a default with Windows 10 does not display the following portfolio style correctly: “Text animation vertical with no filter”.
For example use the Edge browser to go your demo site at https://themes.ishyoboy.com/boldial/portfolios/zoom/ and hover over the first demo portfolio. You’ll see that by hovering a portfolio item the underlaying layer gets displayed first below the actual portfolio.

How do I fix this on my own site? I have the latest version of the theme, updated 26th of August 2015.

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser

IshYoBoy — Tue, 01 Sep 2015 08:20:47 +0000

Hi there,

thanks for pointing out this bug. Yes we can see in the new Edge browser what you mean. Unfortunately we have no clue what could be the problem. Please give us some time to have a look and we’ll get back to you asap.

Have a nice day
Cheers

A 5 star rating is always a great motivation for us if you are happy with our theme or support!
Themeforest | MojoMarketplace | Creative Market

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser

SilverOne — Fri, 13 Nov 2015 08:07:59 +0000

Any update on this?

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser

IshYoBoy — Wed, 18 Nov 2015 13:19:48 +0000

Hey there,

sorry for our small delay, we’ve been pretty busy with finishing our newest theme Kreo. have you seen it btw? ;)

Regarding portfolio issue on Edge browser, the thing is little bit complicated. There are several hover effects on portfolio items available. Almost all of them are made just by pure CSS and a bit of JS. The thing is that IE (11 – 8) and Edge browser doesn’t support some major CSS properties and for us it’s not possible replicate these properties by JS. It means that currently we’re not able to make all portfolio hover effect work on IE and Edge browser. We could just fix Edge browser by disabling all hover effect and replacing them by flip effect, no matter what option you choose in portfolio shortcode.

Here is what it’s needed to be done to fix it:

1. navigate to “assets/frontend/js/” and open file “main.js”
2. on the line nr 78+/- there is this code ish.activate_portfolio_ie_no_3d();
3. paste this code ish.activate_portfolio_edge_no_3d(); right after that
4. on the line nr 1086+/- there is function activate_portfolio_ie_no_3d defined starting with comment // Portfolio IE no 3D
5. paste following code after this whole function finish -> on the line 1114+/-

// Portfolio Edge no 3D ------------------------------------------------------------------------------------------------
if ( ! function_exists( 'activate_portfolio_edge_no_3d' ) ) {
	ish.activate_portfolio_edge_no_3d = function (){

		// Check Edge
		if ( /Edge\/12./i.test(navigator.userAgent) ) {
			var p3d = jQuery('[class*="ish-p-zoomin"], [class*="ish-p-3dcube-"]');
			var toReplace = ' ish-p-3dcube-left ish-p-3dcube-right ish-p-3dcube-top ish-p-3dcube-bottom' +
							' ish-p-3dcube-inverse-left ish-p-3dcube-inverse-right ish-p-3dcube-inverse-top ish-p-3dcube-inverse-bottom' +
							' ish-p-zoomin' +
							' ish-p-zoomin-inverse' +
							' ish-p-zoom-rotate' +
							' ish-p-zoom-rotate-inverse';

			var replaceWith = 'ish-p-flip-top';
            var p3d_classes = '';

            p3d.each( function(){
                var me = jQuery(this);
                p3d_classes = me.attr('class');

                if (  p3d_classes.indexOf('-inverse') != -1 ){
                    replaceWith = 'ish-p-flip-inverse-top';
                }else{
                    replaceWith = 'ish-p-flip-top';
                }

                me.removeClass( toReplace ).addClass( replaceWith );
            });
		}

	}
}

// Portfolio Edge no 3D ------------------------------------------------------------------------------------------------

if ( ! function_exists( 'activate_portfolio_edge_no_3d' ) ) {

ish.activate_portfolio_edge_no_3d = function (){

// Check Edge

if ( /Edge\/12./i.test(navigator.userAgent) ) {

var p3d = jQuery('[class*="ish-p-zoomin"], [class*="ish-p-3dcube-"]');

var toReplace = ' ish-p-3dcube-left ish-p-3dcube-right ish-p-3dcube-top ish-p-3dcube-bottom' +

' ish-p-3dcube-inverse-left ish-p-3dcube-inverse-right ish-p-3dcube-inverse-top ish-p-3dcube-inverse-bottom' +

' ish-p-zoomin' +

' ish-p-zoomin-inverse' +

' ish-p-zoom-rotate' +

' ish-p-zoom-rotate-inverse';

var replaceWith = 'ish-p-flip-top';

var p3d_classes = '';

p3d.each( function(){

var me = jQuery(this);

p3d_classes = me.attr('class');

if ( p3d_classes.indexOf('-inverse') != -1 ){

replaceWith = 'ish-p-flip-inverse-top';

}else{

replaceWith = 'ish-p-flip-top';

}

me.removeClass( toReplace ).addClass( replaceWith );

});

}

That’s should be all to fix portfolio. Please let us know if it works
Cheers

A 5 star rating is always a great motivation for us if you are happy with our theme or support!
Themeforest | MojoMarketplace | Creative Market

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser

SilverOne — Wed, 18 Nov 2015 14:25:49 +0000

Brilliant, it works!

Thanks!

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser

IshYoBoy — Wed, 18 Nov 2015 16:05:32 +0000

Glad to hear that!

A 5 star rating is always a great motivation for us if you are happy with our theme or support!
Themeforest | MojoMarketplace | Creative Market

Support Forum"Text animation vertical with no filter" doesn't work correctly in Edge browser – Support Forum

"Text animation vertical with no filter" doesn't work correctly in Edge browser

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser

Reply To: "Text animation vertical with no filter" doesn't work correctly in Edge browser