Any way to disable dark selection box in HTML widgets?

Question

Level 1

0 points

Any way to disable dark selection box in HTML widgets?

Creating a picture book; using the HTML widget for interactivity...

Any object in the HTML that can be touched shows a semi-transparent dark box on top of the object/graphic when first touched. The box is the bounding rectangle of the object that has interactivity assigned to it.

This does not show up when viewing the content in a web browser; iBA seems to be adding this. Although not a show stopper, this takes away from the visual appeal of the content when interacting with it.

Anyone know of a way to disable this effect?

John

Mac OS X (10.7.2)

Posted on Apr 19, 2012 6:16 PM

Reply

Answer 1

K T

Level 7

23,877 points

Apr 19, 2012 6:34 PM in response to purdyboy

I'm pretty sure that is a default navigation cue courtesy iBooks 2 for iBA content.

If you can screenshot, maybe someone can confirm, etc., thanks.

Reply

Answer 2

purdyboy Author

Level 1

0 points

May 21, 2012 8:08 AM in response to purdyboy

I found a solution to this; thought I would share...

What I was trying to "turn off" was the tap highlight color. It turns out that you can do this by changing a CSS property for the element you want to control. In my case, the element was the entire HTML container that housed my book.

The CSS is:

-webkit-tap-highlight-color: rgba(0,0,0,0);

This make the highlight color transparent and the net result is that you don't see any highlight on the bounding rectangle at all when you touch an object. Works great for my picture book!

For further detail, look here: http://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Referenc e/SafariWebContent/AdjustingtheTextSize/AdjustingtheTextSize.html

JP

Reply