Hello!
Been searching high and low for a good floating menu plugin and this seems to be the only solution, however, i have a few gripes with it.
I would like to leave it in a fixed position in the corner it’s currently in. Right now it follows page scrolling, i would like to stop that.
Second i would like sub-menus to drop-right from the drop-down menus. Is that possible?
Thanks in advance for help, im not advanced in css and php!
]]>Hi,
Great plugin, but in combination with the x theme I have some criticial js errors:
<script id="cornerstone-custom-js">;function initMap(){var e={zoom:4,center:{lat:-33,lng:151},disableDefaultUI:!0};var t=new google.maps.Map(document.getElementById('map'),e)};$(function(){function e(){var e=menuYloc.top+$(this).scrollTop()+'px';$('#floatMenu').animate({top:e},{duration:500,queue:!1})};menuYloc=$('#floatMenu').offset();$(window).scroll(e);e()});var floatingMenu={hasInner:typeof(window.innerWidth)=='number',hasElement:typeof(document.documentElement)=='object'&&typeof(document.documentElement.clientWidth)=='number'};var floatingArray=[];floatingMenu.add=function(t,e){var i,n;if(typeof(t)==='string')i=t;else n=t;if(e==undefined){floatingArray.push({id:i,menu:n,targetLeft:0,targetTop:0,distance:.07,snap:!0,updateParentHeight:!1})}
else{floatingArray.push({id:i,menu:n,targetLeft:e.targetLeft,targetRight:e.targetRight,targetTop:e.targetTop,targetBottom:e.targetBottom,centerX:e.centerX,centerY:e.centerY,prohibitXMovement:e.prohibitXMovement,prohibitYMovement:e.prohibitYMovement,distance:e.distance!=undefined?e.distance:.07,snap:e.snap,ignoreParentDimensions:e.ignoreParentDimensions,updateParentHeight:e.updateParentHeight==undefined?!1:e.updateParentHeight,scrollContainer:e.scrollContainer,scrollContainerId:e.scrollContainerId,confinementArea:e.confinementArea,confinementAreaId:e.confinementArea!=undefined&&e.confinementArea.substring(0,1)=='#'?e.confinementArea.substring(1):undefined,confinementAreaClassRegexp:e.confinementArea!=undefined&&e.confinementArea.substring(0,1)=='.'?new RegExp('(^|s)'+e.confinementArea.substring(1)+'(s|$)'):undefined})}};floatingMenu.findSingle=function(e){if(e.id)e.menu=document.getElementById(e.id);if(e.scrollContainerId)e.scrollContainer=document.getElementById(e.scrollContainerId)};floatingMenu.move=function(e){if(!e.prohibitXMovement){e.menu.style.left=e.nextX+'px';e.menu.style.right=''};if(!e.prohibitYMovement){e.menu.style.top=e.nextY+'px';e.menu.style.bottom=''}};floatingMenu.scrollLeft=function(e){if(e.scrollContainer)return e.scrollContainer.scrollLeft;var t=window.top;return this.hasInner?t.pageXOffset:this.hasElement?t.document.documentElement.scrollLeft:t.document.body.scrollLeft};floatingMenu.scrollTop=function(e){if(e.scrollContainer)return e.scrollContainer.scrollTop;var t=window.top;return this.hasInner?t.pageYOffset:this.hasElement?t.document.documentElement.scrollTop:t.document.body.scrollTop};floatingMenu.windowWidth=function(){return this.hasElement?document.documentElement.clientWidth:document.body.clientWidth};floatingMenu.windowHeight=function(){if(floatingMenu.hasElement&&floatingMenu.hasInner){return document.documentElement.clientHeight>window.innerHeight?window.innerHeight:document.documentElement.clientHeight}
else{return floatingMenu.hasElement?document.documentElement.clientHeight:document.body.clientHeight}};floatingMenu.documentHeight=function(){var n=this.hasInner?window.innerHeight:0,t=document.body,e=document.documentElement;return Math.max(t.scrollHeight,t.offsetHeight,e.clientHeight,e.scrollHeight,e.offsetHeight,n)};floatingMenu.documentWidth=function(){var n=this.hasInner?window.innerWidth:0,t=document.body,e=document.documentElement;return Math.max(t.scrollWidth,t.offsetWidth,e.clientWidth,e.scrollWidth,e.offsetWidth,n)};floatingMenu.calculateCornerX=function(e){var n=e.menu.offsetWidth,t=this.scrollLeft(e)-e.parentLeft;if(e.centerX){t+=(this.windowWidth()-n)/2}
else if(e.targetLeft==undefined){t+=this.windowWidth()-e.targetRight-n}
else{t+=e.targetLeft};if(document.body!=e.menu.parentNode&&t+n>=e.confinedWidthReserve){t=e.confinedWidthReserve-n};if(t<0)t=0;return t};floatingMenu.calculateCornerY=function(e){var n=e.menu.offsetHeight,t=this.scrollTop(e)-e.parentTop;if(e.centerY){t+=(this.windowHeight()-n)/2}
else if(e.targetTop===undefined){t+=this.windowHeight()-e.targetBottom-n}
else{t+=e.targetTop};if(document.body!=e.menu.parentNode&&t+n>=e.confinedHeightReserve){t=e.confinedHeightReserve-n};if(t<0)t=0;return t};floatingMenu.isConfinementArea=function(e,t){return e.confinementAreaId!=undefined&&t.id==e.confinementAreaId||e.confinementAreaClassRegexp!=undefined&&t.className&&e.confinementAreaClassRegexp.test(t.className)};floatingMenu.computeParent=function(e){if(e.ignoreParentDimensions){e.confinedHeightReserve=this.documentHeight();e.confinedWidthReserver=this.documentWidth();e.parentLeft=0;e.parentTop=0;return};var o=e.menu.parentNode,n=this.offsets(o,e);e.parentLeft=n.left;e.parentTop=n.top;e.confinedWidthReserve=o.clientWidth;var t=o,i=this.offsets(t,e);if(e.confinementArea==undefined){while(t.clientHeight+i.top<e.menu.scrollHeight+n.top||e.menu.parentNode==t&&e.updateParentHeight&&t.clientHeight+i.top==e.menu.scrollHeight+n.top){t=t.parentNode;i=this.offsets(t,e)}}
else{while(t.parentNode!=undefined&&!this.isConfinementArea(e,t)){t=t.parentNode;i=this.offsets(t,e)}};e.confinedHeightReserve=t.clientHeight-(n.top-i.top)};floatingMenu.offsets=function(e,n){var t={left:0,top:0};if(e===n.scrollContainer)return;while(e.offsetParent&&e.offsetParent!=n.scrollContainer){t.left+=e.offsetLeft;t.top+=e.offsetTop;e=e.offsetParent};if(window==window.top)return t;var o=window.top.document.body.getElementsByTagName('IFRAME');for(var i=0;i<o.length;i++){if(o[i].contentWindow!=window)continue;e=o[i];while(e.offsetParent){t.left+=e.offsetLeft;t.top+=e.offsetTop;e=e.offsetParent}};return t};floatingMenu.doFloatSingle=function(e){this.findSingle(e);if(e.updateParentHeight){e.menu.parentNode.style.minHeight=e.menu.scrollHeight+'px'};var t,n;this.computeParent(e);var o=this.calculateCornerX(e),t=(o-e.nextX)*e.distance;if(Math.abs(t)<.5&&e.snap||Math.abs(o-e.nextX)<=1){t=o-e.nextX};var i=this.calculateCornerY(e),n=(i-e.nextY)*e.distance;if(Math.abs(n)<.5&&e.snap||Math.abs(i-e.nextY)<=1){n=i-e.nextY};if(Math.abs(t)>0||Math.abs(n)>0){e.nextX+=t;e.nextY+=n;this.move(e)}};floatingMenu.fixTargets=function(){};floatingMenu.fixTarget=function(e){};floatingMenu.doFloat=function(){this.fixTargets();for(var e=0;e<floatingArray.length;e++){this.fixTarget(floatingArray[e]);this.doFloatSingle(floatingArray[e])};setTimeout('floatingMenu.doFloat()',20)};floatingMenu.insertEvent=function(e,t,i){if(e.addEventListener!=undefined){e.addEventListener(t,i,!1);return};var n='on'+t;if(e.attachEvent!=undefined){e.attachEvent(n,i);return};var o=e[n];e[n]=function(e){e=(e)?e:window.event;var t=i(e);return(o!=undefined)&&(o(e)==!0)&&(t==!0)}};floatingMenu.init=function(){floatingMenu.fixTargets();for(var e=0;e<floatingArray.length;e++){floatingMenu.initSingleMenu(floatingArray[e])};setTimeout('floatingMenu.doFloat()',100)};floatingMenu.initSingleMenu=function(e){this.findSingle(e);this.computeParent(e);this.fixTarget(e);e.nextX=this.calculateCornerX(e);e.nextY=this.calculateCornerY(e);this.move(e)};floatingMenu.insertEvent(window,'load',floatingMenu.init);if(typeof(jQuery)!=='undefined'){(function(e){e.fn.addFloating=function(e){return this.each(function(){floatingMenu.add(this,e)})}})(jQuery)};</script>
Can you see what happen here?
many thanks,
Bouke
Hi all,
I’ve install this plugin and works great. My problem is I want the menu to appear only on desktop devices (not mobile).
I have do it with many elements of the site using something like this
@media only screen and (max-width:1000px) {
.elementname {display:none;visibility:hidden;}
}
The problem is I’m unable to do this with the floating menu. I’ve spent hours with this with no succeed, I can’t find a div or another element in with I apply this method.
I’ve been trying to apply directly an style to make display:none and visibility hidden to all the elements on the files dcwp_floating_menu.php and dcwp_floating_menu_widget.php (including of course dcjq-floating-menu, but it seems impossible, I cant make the menu dissapear (first step to make it responsive).
The only way I have to make dissapear is completely delete the div with class=”dcjq-floating-menu”, but of course, deleting if from code make dissapear on all devices.
Can anyone help me? I need a way to make display:none.
Many thanks in advance
]]>Hi
I would like to change size and font face of my floating menu, is this possible?
hi !
great simple plugin, easy to adapt and style, look how i did it ??
other stuff i found was full of tooooo many things to adapt (even gradient eh !) which made the whole thing üBER complicated.. trust me ..
anyway, there is one little thing i would love to make happen, and i wondered if you can help me with it:
When arriving on my site, i first want the menu to be hidden completely, and only to show after having scrolled app. 100-150px (the height of the menu bar).
Is this possible ? Do i need to tweak the query :z ??
thank you ??
]]>Hi,
I have recently installed the Floating Menu plugin. It does work on a blog page within the widget area. However, if I insert the short-code into a page, it renders a hyperlink “click here” but the menu doesn’t appear. There is a ‘#’ within the href tag.
Any ideas would be appreciated. https://www.cyclepenistone.org.uk/cycle-safety
Thanks!
]]>Good plugin. But fixing width to 980 pixels causes white blank space in the middle and empty erratic tabs.
Also, horizontal tabbing with full page width possiblilty (like in the usual header menubars) would take this plugin to a totally different level.
I see only the menu items but not tab’title or color .
]]>Hi – first, great plugin thank you!
I have one small issue. When I install the plugin the title of the menu shows up fine, but then the content that opens which I click or hover shifts to the right of the menu title.
I saw this same issue mentioned in a previous support post but there was no reply so I didn’t know what to do to fix it.
Any help is appreciated.
]]>Can I have different menus on different pages and not on every page?
Thanks
Mike
]]>Is there a tweak to open in new page?
]]>Hello,
I’ve installed the plugin and it works perfect on the PC. But the menu doesn’t show on mobile device.
Any suggestions?
Thanks
]]>Hi there I am considering this script but would like to know if this is responsive?
regards…
]]>Hi!
I’ve installed your plugin and works fine with Firefox and Safari but not on chrome and explorer…is there any support for this?
Thanks very much in advance!
]]>Hi, been having some problems lately with this plugin when i add the widget it just appears as a normal menu, but when i click customize on the theme im running and view the site that way the floating menu works perfectly. Any idea how i can fix this or what might be causing the problem?
]]>Thanks for the great plugin!
May I know how can i center the text in Tab Text?
Thanks!
]]>This plugin is amazing!!!
I wanted to know how I can add a drop shadow around the white menu. This is my URL https://bit.ly/KTwxlv
Thank you in advance!
]]>Thanks for providing a slick alternate menu choice. [Text moderated]
Vern
]]>remix4, mate, this is really good ??
i really need to use your plugin and maybe you could give me a hand…
– i bought a theme and it’s blocking FM from running
– chrome inspector is throwing this error 351Uncaught TypeError: Object [object Object] has no method ‘dcFloater’
– i really don’t know nothing about jQuery or its libraries…
this is a clean multisite installation, with a theme switcher (good theme/bad theme), and FM running as a widget
cheers,
]]>Hi
I needed a floating menu for the pages not for the widgets: will this one work?
If so how do I put it on a page?
thanks
Ana
HI,
Many thanks for the contrib, i have a slight issue. It installed and works fine, except, the menu titles are offset to the right hand side of the box title instead of being directly underneath. any ideas as to why this may occur?
]]>Great plugin, working just fine, my issue is I use different sidebars on different pages therefore i can only use the widget once on my homepage…
QUESTION: Is there a php code I can use on my footer.php file or other alternative to make the widget appear on other pages?
]]>That’s it! Doesn’t work.
]]>Doesn’t work on 3.1.2, no options and no menu.
]]>