Where can I find the code in featherlight lightbox that enables the looking glass/magnifying glass? I wish to disable it and just have the normal mouse pointer..
Just add the necessary CSS to target what you want and set the cursor how you want it
Related
Im looking for this effect in background http://prism.umbrella.al/agency/. I saw it on few sites. This with green line and dots. Can you tell me how its called or give a link?
It a canvas drawing,
using mouse move event to fetch coordinates of mouse and draw accordingly
you can see there page source to check the code
I'm trying to create a legend which should work like on this site but I can't get it to work...
(press the 'i' button)
http://mtbmap.no/#6/63.400/10.390
I tried popup with easy button plugin but it shows up on the middle of the screen. I would like to have toggle like on mtbmap.
Here's my working site
http://pomorskieszlaki.pl/index.html#9/54.2516/18.3774/osm-rowerowe-piesze-ddr
Any chance to point me the right way?
Thanks a lot. I'm still a newbie with JS...
If you are still looking to add this feature to your map, there is a way.
You can use makeIcon( with your attributes) to embed, size and attach a graphic icon, you can also set the distance away from the icon that this popu opens up.
Then you can addPopup(with your attributes) to add a popUp box to that icon which is editable as any other popup would be.
What i'm trying to do?
I'm trying to hide mouse cursor in flowplayer when the user is not interacting with it for some time.
Why i'm doing this?
I consider this a basic functionality for any video player. All other players do this (YouTube, Vimeo, VideoJS, etc). Looks like there is no such functionality in flowplayer out of the box so i'm trying to plug it in somehow.
Question
How do i hide mouse cursor in flowplayer when client is not interacting with the player for some time?
Solution
So to hide the mouse cursor in flowplayer you can use the following CSS code:
.flowplayer.is-mouseout .fp-ui {
cursor:
url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjbQg61aAAAADUlEQVQYV2P4//8/IwAI/QL/+TZZdwAAAABJRU5ErkJggg=='),
url('blank.cur'),
none !important
;
}
See the Demo on jsfiddle.
Explanation
The flowplayer will attach CSS class called "is-mouseout" both when cursor is out of the player and when the cursor is not moving for some time (at the same time when toolbar auto-hides).
We are replacing the cursor with an empty PNG image or an empty cursor file (IE). In the end we are falling back to the "cursor: none;" style (valid in CSS3).
Don't forget to create zero-length "blank.cur" file in proper location!
CSS solution to hide the cursor in more detail.
Notice
There is a bug in Blink rendering engine (used both by Chrome and Opera browsers). It is discussed here with the flowplayer developers. You can try to apply discussed solution yourself or just wait for flowplayer revision 5.5 (current 5.4.3).
Im looking to create a landing page that emulates DropBox (in wordpress). I was wondering how they achieved the effect of clicking the play button that overlays the background box that then turns into a video?
I see from the source that they are using JW player but again no clue on where to start with this. Are there skins you can buy that allow this? Any ideas to lead me in the right direction are appreciated.
Thanks
Can be done easily with jquery and css. First, absolute position both divs centrally on the page so that when visible one is on top of the other, then set the video div css to "display:none;". Then you can use jquery to show the video and hide the play button on click, something like this:
$(function(){
$('#play-btn').click(function(){
$('#play-btn').hide();
$('#video').show();
});
});
Simply done mi amigo. Bare in mind they don't have to be centered, they just have to be positioned one above the other...
Well, title explains all. I'm trying to get rid of the highlight that comes around of the selected button in a ToggleButtonBar
To get the exact look you want your best bet is to jump in Flash, Fireworks, Photoshop, etc and tweak a button skin to your liking. The border is part of the skin. You can create a programmatic skin as well.
A quick fix is to set the highlight the same color as the button.
ToggleButtonBar{
button-style-name: "myButton";
}
Button.myButton{
theme-color: #999999;
}
Mind you...it is purely a quick fix and will tweak your button hover color as well so only use it as a small win.
I eventually find how to resolve it, quiet simple actually! (Thanks to the KapInspect tool)
I just had to create a custom skin for the selectedDownSkin style