Title: Coding Thoughts
Last modified: July 27, 2018

---

# Coding Thoughts

 *  [bigflannel](https://wordpress.org/support/users/bigflannel/)
 * (@bigflannel)
 * [7 years, 10 months ago](https://wordpress.org/support/topic/coding-thoughts/)
 * Hi Keith
 * Thank you for making this plugin. I had been using your old code, version 2.2
   I think, when I realized you could still save with a long hold (mobile right 
   click) in iOS.
 * I updated to your current code and it does have a couple of issues so I started
   digging in.
 * It seems the desktop code works for everything but iOS, so disabling the following
   with preventDefault works across desktops, Android and Windows mobile I think:
 * document.addEventListener(‘mousedown’, disableEvent);
    document.addEventListener(‘
   contextmenu’, disableEvent); document.addEventListener(‘copy’, disableEvent);
   document.addEventListener(‘cut’, disableEvent);
 * The problem starts with iOS in my experience, it does not support the above non
   touch screen defaults and instead everything is done through the touch event.
   As soon as we mess with the touch event it breaks clicking, scrolling etc.
 * I dug and dug and found this:
    [https://stackoverflow.com/questions/12304012/preventing-default-context-menu-on-longpress-longclick-in-mobile-safari-ipad](https://stackoverflow.com/questions/12304012/preventing-default-context-menu-on-longpress-longclick-in-mobile-safari-ipad)
 * and have tried and tested code using it where I apply the following css to images:
 * -webkit-touch-callout: none;
    -webkit-user-select: none;
 * it blocks the iOS context menu!
 * Currently I am testing code still, but I am combining javascript preventDefault
   on desktop events with the css code above and it seems to work. No glitches, 
   and the same functionality, no right click and no drag across all browsers, desktop
   and mobile.
 * Hope this helps and am fascinated to chat it though with you. Let me know.
 * Regards
    Mike

Viewing 8 replies - 1 through 8 (of 8 total)

 *  [Keith P. Graham](https://wordpress.org/support/users/kpgraham/)
 * (@kpgraham)
 * [7 years, 10 months ago](https://wordpress.org/support/topic/coding-thoughts/#post-10534888)
 * Very cool!
 * I think that I saw this in passing and may have not considered it because I wanted
   to block the context menu only when the event was started from an image or element
   with a background image.
 * I will test it over the weekend and if I like it, I may make it one of the options.
 * I really appreciate your interest in this. It is a cool thing that you’ve gone
   out out your way to help an old coder in his little hacking projects.
 * Thanks,
 * Keith
 *  [Keith P. Graham](https://wordpress.org/support/users/kpgraham/)
 * (@kpgraham)
 * [7 years, 10 months ago](https://wordpress.org/support/topic/coding-thoughts/#post-10536358)
 * I have made some changes and it works correctly on my iPad with images and elements
   with background images.
 * I will test it, let it rest a bit, and then if it still works I’ll put it on 
   the WordPress repository.
 * I had similar code in a very old version of the plugin, but took it out. The 
   trouble is that I don’t remember why. I hope that nobody complains about broken
   websites because of this. I think it might effect link clicking. I’ll test it
   better when it rains later this week and I have some time.
 * I’ll have it up on [http://www.BlogsEye.com](http://www.BlogsEye.com) under beta
   test plugins.
 * Thanks again,
 * Keith
 *  Thread Starter [bigflannel](https://wordpress.org/support/users/bigflannel/)
 * (@bigflannel)
 * [7 years, 10 months ago](https://wordpress.org/support/topic/coding-thoughts/#post-10540934)
 * Hi Keith
 * No problem I am pleased the code might be helpful. Your work has helped me, it
   is a pleasure to be able to help in return.
 * That’s always the worry isn’t it, that something breaks something for someone
   somewhere … I am still testing, I will keep you posted if I learn of any problems.
   So far so good.
 * Regards
    Mike
 *  [Keith P. Graham](https://wordpress.org/support/users/kpgraham/)
 * (@kpgraham)
 * [7 years, 10 months ago](https://wordpress.org/support/topic/coding-thoughts/#post-10541025)
 * The code broke sites that use scrolling by killing the drag events on images.
 * I need to figure a better way to get things working on apple devices.
 * Apple complicates things in that the css stays active in its cache long after
   the plugin is updated. Many panicky users contacting me.
 * Keith
 *  Thread Starter [bigflannel](https://wordpress.org/support/users/bigflannel/)
 * (@bigflannel)
 * [7 years, 10 months ago](https://wordpress.org/support/topic/coding-thoughts/#post-10541068)
 * Hi Keith
 * I looked at the beta download on WordPress … In my testing it is use of the touch
   event (document.addEventListener(“touchstart”,kpg_nrci_cm, false);) that creates
   problems for iOS, not the css. I use this code:
 *     ```
       jQuery(document).ready(function() {
         jQuery('img').css('-webkit-user-select', 'none').css('-webkit-touch-callout', 'none'); 
         document.addEventListener('mousedown', bf.disableEvent);
         document.addEventListener('contextmenu', bf.disableEvent);
         document.addEventListener('copy', bf.disableEvent);
         document.addEventListener('cut', bf.disableEvent);
         bf.windowLoseFocus();
       }
   
       bf.disableEvent = function(event){
       	console.log('bf.disableEvent');
           if (event.target.tagName == "IMG") {
           	event.cancelBubble = true;
           	if(event.preventDefault != undefined) {
           		event.preventDefault();
           	}
           	if(event.stopPropagation != undefined) {
           		event.stopPropagation();
           	}
           	return false;
           }
       }
       bf.windowLoseFocus = function() {
       	console.log('bf.windowLoseFocus');
       	function onBlur() {
       		jQuery('main img, aside img').addClass('image-lose-focus');
       	};
       	function onFocus(){
       		jQuery('main img, aside img').removeClass('image-lose-focus');
       	};
       	if (/*@cc_on!@*/false) { // check for Internet Explorer
       		document.onfocusin = onFocus;
       		document.onfocusout = onBlur;
       	} else {
       		window.onfocus = onFocus;
       		window.onblur = onBlur;
       	}
       }
       ```
   
 * I’m using it on a site that already uses jQuery, so I use jQuery’s ‘jQuery(document).
   ready’ but you don’t have to use jQuery.
 * I’m not sure if this helps …
 * The code above also includes a little additional obfustication, images are made
   transparent when the browser loses focus which happens when someone uses the 
   screengrab app to take a screengrab. It’s NOT bulletproof in anyway, but none
   of this is and it possibly all helps.
 * Regards
    Mike
 *  [Keith P. Graham](https://wordpress.org/support/users/kpgraham/)
 * (@kpgraham)
 * [7 years, 10 months ago](https://wordpress.org/support/topic/coding-thoughts/#post-10552551)
 * This is why I ignored the plugin for many years.
 * My IOS testing does not block the scrolling with touchstart. I have to sit down
   when I have time and retest the whole thing.
 * btw, I can’t use jQuery because it is possible (although uncommon) for a wordpress
   website to not have jQuery. Although I am OK with javascript, having written 
   my first javascript routines in the 1990s, I never learned anything but cookbook
   jQuery.
 * Keith
 *  Thread Starter [bigflannel](https://wordpress.org/support/users/bigflannel/)
 * (@bigflannel)
 * [7 years, 9 months ago](https://wordpress.org/support/topic/coding-thoughts/#post-10556371)
 * Hi Keith
 * Its definitely complicated. I’m pretty sure in iOS scrolling starts with a touchstart
   event. preventDefault on touchstart impacts scrolling. But I could be wrong. 
   I’ve not spent a huge amount of time on it.
 * Let me know if I can help you test etc. Am happy to.
 * Regards
    Mike
 *  [Keith P. Graham](https://wordpress.org/support/users/kpgraham/)
 * (@kpgraham)
 * [7 years, 9 months ago](https://wordpress.org/support/topic/coding-thoughts/#post-10589959)
 * I’ve set the defaults to not implement the Apple stuff. I will let users turn
   it on if they think they need it rather than have it on by default.
 * Android still does not work right in the default browser. Some mobile browsers
   are brain dead and ignore all of this stuff.
 * At least some people will find it useful.
 * Keith

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Coding Thoughts’ is closed to new replies.

 * ![](https://ps.w.org/no-right-click-images-plugin/assets/icon-256x256.png?rev
   =3014811)
 * [No Right Click Images](https://wordpress.org/plugins/no-right-click-images-plugin/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/no-right-click-images-plugin/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/no-right-click-images-plugin/)
 * [Active Topics](https://wordpress.org/support/plugin/no-right-click-images-plugin/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/no-right-click-images-plugin/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/no-right-click-images-plugin/reviews/)

 * 8 replies
 * 2 participants
 * Last reply from: [Keith P. Graham](https://wordpress.org/support/users/kpgraham/)
 * Last activity: [7 years, 9 months ago](https://wordpress.org/support/topic/coding-thoughts/#post-10589959)
 * Status: not a support question