Member Avatar for samsons17

Hi all..

I want to disable 'centre click' of mouse for my website..How could i do this??

Thank You :)

  • 2 Contributors
  • 5 Replies
  • 124 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Borzoi

Dani AI

Generated

As said, trying to block the middle button is treating a symptom, not the disease. The horizontal gap you showed was caused by an element wider than the viewport; adjusting the menu width fixed it for you, . Below are quick, practical debugging steps and safe fixes so the layout itself stops producing horizontal scroll.

Open DevTools and inspect visually (select element, hover to see dimensions). Two fast helpers you can paste into the console to locate offenders:

// list elements whose bounding box extends outside the viewport
(function(){
  var ww = window.innerWidth;
  [].slice.call(document.querySelectorAll('body *')).forEach(function(el){
    var r = el.getBoundingClientRect();
    if (r.right > ww || r.left < 0) console.log('Overflowing element:', el, r);
  });
})();
/* temporary visual aid to spot wide elements */
* { outline: 1px solid rgba(255,0,0,0.12); }

Common culprits and reliable fixes:

  • Images, iframes or videos with fixed widths — make them fluid with max-width:100% and height:auto.
  • Containers using width plus padding/margins that exceed the viewport — use box-sizing: border-box or convert fixed widths to percentages.
  • Long unbroken strings or very long words — use overflow-wrap: break-word (or word-wrap fallback).
  • Absolutely positioned or transformed elements pushed off-screen — check their computed position and transforms.

Masking the problem (hiding scrollbars) or intercepting middle-click is fragile and harms usability. If disabling middle-click is still required (not recommended), it’s browser-dependent and incomplete; a simple listener might prevent some middle-click actions, but fixing the layout is the correct, robust solution.

Recommended Answers

All 5 Replies

Member Avatar for Borzoi

Why do you want to disable centre click? All it does is scroll or open links in a new tab.

Member Avatar for samsons17

I want to disable the centre click because the user could also scroll to right or the left of the webpage insteaad of just down and up..

I do not want the user to scroll to the right of my webpage beacause i got problem with the my image baground,and causing a space to the right of the page,which i do not want to.


Look at the image above,that is the unwanted space that i just mentioned.I've tried to modified the code like putting the width and so on,but it is still not working.This is the original code of the body where i put my baground :

body {
    background-image:url(../images/bg-home.jpg);
    margin: 0;
    padding: 0;
    overflow-x:hidden;
}


I dont know what else to do,so that i am deciding to just disable the center click..
Please help me.
Thank You..

space.jpg 24.42 KB
Member Avatar for Borzoi

Disabling centre click won't stop them from scrolling across.

It's very likely you have some content on your page which is stretching it wider than you want. Also, the url in the background image should have quotes:

background-image: url('../images/bg-home.jpg');
Member Avatar for samsons17

oh i see..now my problem is fixed.Theres the menu width i needed to modify.

But how could the other scrolling across without the center click.

But anyway, Thank You for your time :)

Member Avatar for Borzoi

The scrollbar at the bottom of the page would have allowed them to scroll horizontally and if they had scroll lock enabled, they could just use the arrow key. Highlighting the problem area would also allow them to effectively "drag" the screen across.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.