On Mobile Safari, when you click on an element it gets a grey box around it between mousedown and mouseup.
How do you turn this off?
I was looking for the answer as well, and found it in the jQTouch CSS source code. Just add this to your definitions: -webkit-tap-highlight-color: rgba(0,0,0,0); Note that the box shows up for anything with a "click" or "touchend" listener (I think), so for best results, toss it under body { }
Related
I'm implementing picture-in-picture on my website but I have various custom video controls (for play/pause, seek etc). When I enter pictureinpicture (using requestPictureInPicture()), the video pops out properly, but it has the play/pause control, which I don't want (I want to just use my custom controls).
Is there any way to hide the play/pause control (or all controls) from the floating PIP window?
The only customization I can find is in CSS for the empty video that remains in the main page - so I can hide that altogether via
:picture-in-picture { display: none; }
but I don't see any way to customize the look of the floating PIP window, including removing some/all controls.
Thanks,
David
I ask if konva.js may behave like other graphics libraries as Raphael.js or Paper.js when the mouse is pressed and then leaves the canvas or browser window, this video illustrates the difference in behavior by default.
https://www.youtube.com/watch?v=DeBNJiN_Vdo
Is there a trick to konva.js work the same way?
(google translator)
It is fixed in develop version.
You can get the last build here: https://raw.githubusercontent.com/konvajs/konva/master/konva.js
Using version 2.1.0 of durandal I found a problem I am not able to fix it seems.
I'm using a dialog but the content is too big for the screen, the buttons - which are at the bottom of the screen - kind of fall off, under the screen.
This mostly comes from the fact that I use visible bindings using knockout the show and hide elements on the dialog making durandal position it wrong and/or not showing a scrollbar for the dialog/screen when it overflows.
Does anyone know how to solve this by either getting a scrollbar or repositioning it on the screen?
I have tried the reposition method but to no success.
Moreover I tried both of these:
Responsive dialog
Durandal modal dialog
Both did not help out and I'm still stuck on this.
Anyone got any idea how to get the scrollbar on the dialog or on the screen so I can actually see my buttons by scrolling? Or is there a better way to get around this?
I'm not sure this is what you want
.modal-body {
max-height: calc(100vh - 210px);
overflow-y: auto;
}
http://jsfiddle.net/farizazmi/5Lnqurar/
This video is set to autoplay and loop. The start is ok. Wheel spinning video loading. But after the first playback the spinner comes up again. Any solution for this?
Maybe this is related issue:
The test video on videojs.com when opened through Internet Explorer.
Click play, then skip to near the end of the video. It's not set to
loop, but anyway after the playback it returns to the start in Paused
mode, and you can actually see the spinner behind the play button.
However it's not animated, in my case it's spinning.
You can add this: data-setup='{"children": {"loadingSpinner": false}}' to your video tag, it will remove the spinner.
This seems to be a fairly common issue with VideoJS. I noticed you already set display: none; on the .vjs-loading-spinner element and that's not working, so I was able to get rid of it by using jQuery to remove the element from the dom.
$('.vjs-loading-spinner').remove();
That should take care of the problem, though I realize this is probably not ideal.
Task: I wanted to create a simple share button which extends to a share section (F,T,G,P) when clicked.
I failed to let the section slide out of the share button - what I really, really wanted - but managed to let a separate ul element slide out on the right side.
The animation worked… until I set the ul to hide initially via $('.networks').hide();
The sections is intended to only show up after a click, but now after the first click it just "pops open" ignoring the configured slide-out. Sliding only works in both directions (open and close) after clicking on it at least once .
I've uploaded an Example here at Codepen.io and as a jsFiddle.
Side note: the demos are behaving a little bit strange since they appear to only show a slide-in fx. The slide-out fx, with which we start, always looks like it pops open - that's not the case, it works after the second click, so you got to focus your eyes to see it (on a normal browser it visibly works better).
PS: Bonus points if you help me make this slide out of the "share" button. Be aware that I only have rudimentary knowledge of Javascript ( * duck and run * ).
Take a look at this fiddle link.
I changed the display property of the buttons to be inline-block instead of inline.
Elements with display inline can not have a width and i think it was the reason why jQuery was not able to animates the Elements width. I also animated the wrap around the ul instead of the ul.
EDIT: made a fast mockup of the thing sliding out of the button. Changed some css to be on the list elements itself instead of on the a elements, just work through the css and I think it will look ok.
edit forgot the link: link