• Hi – love the plugin but it’s clashing with something in Visual Composer
    I’m using the VC media grid element to display a pop-up photo, but after the photo is closed, it causes #! to appear after the url and all the images that have css animations fail to load on a browser refresh.

    Here’s what the Visual Composer support said:

    You have plugin which uses location.hash and conflicts if hash is not equals to some id (actually it triggers and javascript error) and this is why our js is not working at all.
    plugin which conflicts: page-scroll-to-id
    js file: jquery.malihu.PageScroll2id-init.js

    _`hash=location.hash || null,
    _validateLocHash=function(val){
    return $(val).length && $(“a[href*='”+val+”‘]”).filter(function(){return $(this).data(_p+”Element”)==true}).length;
    },`

    you can add a function that checks if “val” is valid seletor like this:

    function isValidSelector(selector) {
        try {
            var $element = $(selector);
        } catch(error) {
            return false;
        }
        return true;
    }
    _validateLocHash=function(val){
           return isValidSelector(val) && $(val).length
    && $("a[href*='"+val+"']").filter(function(){return
    $(this).data(_p+"Element")==true}).length;
         },

    https://wordpress.org/plugins/page-scroll-to-id/

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author malihu

    (@malihu)

    Hi and thanks for the feedback.

    I’ll investigate this and add a fix on the next plugin version. In the meanwhile you can manually add the fix suggested in jquery.malihu.PageScroll2id-init.js in plugin’s directory.

    Thread Starter kcmuppet

    (@kcmuppet)

    I’m not much of a technician is there somewhere specific I need to add it in that file? Do I put it at the end after:

    <val.substr(1) : $(a).height()===parseInt(val);
    		}
    	});
    })(jQuery);

    ???

    Plugin Author malihu

    (@malihu)

    In jquery.malihu.PageScroll2id-init.js replace:

    _validateLocHash=function(val){
        return $(val).length && $("a[href*='"+val+"']").filter(function(){return $(this).data(_p+"Element")==true}).length;
    },

    with:

    _isValidSelector=function(selector){
        try{
            var $element=$(selector);
        }catch(error){
            return false;
        }
        return true;
    },
    _validateLocHash=function(val){
        return _isValidSelector(val) && $(val).length && $("a[href*='"+val+"']").filter(function(){return $(this).data(_p+"Element")==true}).length;
    },
    Thread Starter kcmuppet

    (@kcmuppet)

    Thanks. I made the edits, but it hasn’t changed the error. Perhaps I didn’t edit it correctly. My file now reads exactly like this:

    (function($){
    	var _p="mPS2id",
    		_o=mPS2id_params,
    		shortcodeClass=_o.shortcode_class, //shortcode without suffix
    		_hash=location.hash || null,
    		_isValidSelector=function(selector){
        try{
            var $element=$(selector);
        }catch(error){
            return false;
        }
        return true;
    },
    _validateLocHash=function(val){
        return _isValidSelector(val) && $(val).length && $(&quot;a[href*='&quot;+val+&quot;']&quot;).filter(function(){return $(this).data(_p+&quot;Element&quot;)==true}).length;
    },
    		_offset=function(val){
    			if(val.indexOf(",")!==-1){
    				var arr=val.split(","),y=arr[0] || "0",x=arr[1] || "0";
    				return {"y":y,"x":x};
    			}else{
    				return val;
    			}
    		},
    		_screen=function(val){
    			if(val.indexOf(",")!==-1){
    				var arr=val.split(","),x=arr[0] || "0",y=arr[1] || "0";
    				return [x,y];
    			}else{
    				return val;
    			}
    		};
    	$(document).ready(function(){
    		for(var k=0; k<_o.total_instances; k++){
    			//scroll to location hash on page load
    			if(_o.instances[_p+"_instance_"+k]["scrollToHash"]["value"]==="true" && _hash){
    				$(_o.instances[_p+"_instance_"+k]["selector"]["value"]+",."+shortcodeClass).each(function(){
    					$(this).data(_p+"Element",true);
    				});
    				if(_validateLocHash(_hash)){
    					var href=window.location.href.replace(/#.*$/,"#"),
    						layout=_o.instances[_p+"_instance_"+k]["layout"]["value"];
    					if(layout!=="horizontal"){
    						$(window).scrollTop(0); //stop jump to hash straight away
    					}
    					if(layout!=="vertical"){
    						$(window).scrollLeft(0); //stop jump to hash straight away
    					}
    					if(window.history && window.history.pushState){
    						window.history.pushState("","",href);
    					}else{
    						window.location.href=href;
    					}
    				}
    			}
    		}
    	});
    	$(window).load(function(){
    		for(var i=0; i<_o.total_instances; i++){
    			$(_o.instances[_p+"_instance_"+i]["selector"]["value"]+",."+shortcodeClass).mPageScroll2id({
    				scrollSpeed:_o.instances[_p+"_instance_"+i]["scrollSpeed"]["value"],
    				autoScrollSpeed:(_o.instances[_p+"_instance_"+i]["autoScrollSpeed"]["value"]==="true") ? true : false,
    				scrollEasing:_o.instances[_p+"_instance_"+i]["scrollEasing"]["value"],
    				scrollingEasing:_o.instances[_p+"_instance_"+i]["scrollingEasing"]["value"],
    				pageEndSmoothScroll:(_o.instances[_p+"_instance_"+i]["pageEndSmoothScroll"]["value"]==="true") ? true : false,
    				layout:_o.instances[_p+"_instance_"+i]["layout"]["value"],
    				offset:_offset(_o.instances[_p+"_instance_"+i]["offset"]["value"].toString()),
    				highlightSelector:_o.instances[_p+"_instance_"+i]["highlightSelector"]["value"],
    				clickedClass:_o.instances[_p+"_instance_"+i]["clickedClass"]["value"],
    				targetClass:_o.instances[_p+"_instance_"+i]["targetClass"]["value"],
    				highlightClass:_o.instances[_p+"_instance_"+i]["highlightClass"]["value"],
    				forceSingleHighlight:(_o.instances[_p+"_instance_"+i]["forceSingleHighlight"]["value"]==="true") ? true : false,
    				keepHighlightUntilNext:(_o.instances[_p+"_instance_"+i]["keepHighlightUntilNext"]["value"]==="true") ? true : false,
    				highlightByNextTarget:(_o.instances[_p+"_instance_"+i]["highlightByNextTarget"]["value"]==="true") ? true : false,
    				disablePluginBelow:_screen(_o.instances[_p+"_instance_"+i]["disablePluginBelow"]["value"].toString())
    			});
    			//scroll to location hash on page load
    			if(_o.instances[_p+"_instance_"+i]["scrollToHash"]["value"]==="true" && _hash){
    				if(_validateLocHash(_hash)){
    					$.mPageScroll2id("scrollTo",_hash);
    					if(window.history && window.history.pushState){
    						window.history.pushState("","",_hash);
    					}else{
    						window.location.hash=_hash;
    					}
    				}
    			}
    		}
    	});
    	//extend jQuery's selectors
    	$.extend($.expr[":"],{
    		//position based - e.g. :fixed
    		absolute:$.expr[":"].absolute || function(el){return $(el).css("position")==="absolute";},
    		relative:$.expr[":"].relative || function(el){return $(el).css("position")==="relative";},
    		static:$.expr[":"].static || function(el){return $(el).css("position")==="static";},
    		fixed:$.expr[":"].fixed || function(el){return $(el).css("position")==="fixed";},
    		//width based - e.g. :width(200), :width(>200), :width(>200):width(<300) etc.
    		width:$.expr[":"].width || function(a,i,m){
    			var val=m[3].replace("<","<").replace(">",">");
    			if(!val){return false;}
    			return val.substr(0,1)===">" ? $(a).width()>val.substr(1) : val.substr(0,1)==="<" ? $(a).width()<val.substr(1) : $(a).width()===parseInt(val);
    		},
    		//height based - e.g. :height(200), :height(>200), :height(>200):height(<300) etc.
    		height:$.expr[":"].height || function(a,i,m){
    			var val=m[3].replace("<","<").replace(">",">");
    			if(!val){return false;}
    			return val.substr(0,1)===">" ? $(a).height()>val.substr(1) : val.substr(0,1)==="<" ? $(a).height()<val.substr(1) : $(a).height()===parseInt(val);
    		}
    	});
    })(jQuery);
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Conflict with Visual Composer’ is closed to new replies.