Acorn - installed and active Xara software: Cloud+/Pro+, XDPXv18 , XWDPv12/v15, XPGDv10, X3D7, Xara Xtreme 5, and others back through time (to CC's Artworks).
Technical remediation and consultancy for your web designs. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy
Thanks Acorn,
I did try your new version, but should one want to have an object with a LINK then the MouseOver of the linked object removes the background that would otherwise be present, or if you give that object the pass-through name it cannot pick up the link en-route.
This was not the case with your earlier version I used > https://initiostar.co.uk/demo/Underlay/.
I also tested your first version with a video (placeholder on the MouseOver layer) and it works other than one cannot maintain the default cursor; maybe I would have to add that to the placeholder code?
While on the subject of MouseOver and video, some time back you & Egg developed an effect which I extended to have a MouseOver video background> https://initiostar.co.uk/demo/eggAnchor/. The cursor looked like it had a minor change, but unfortunately I cannot trace the TG thread to work out how we did it. Anime.js springs to mind?
@Egg - tested the second version and it worked on desktop FF here.
Gary, I did say that the pass-through stopped any triggers.
I felt the loss of the background when on a Link was a fair choice as it then let you know something was afoot.
The first approach was fine if the entire object was the Link; you cannot add a Link to text unless it is for the complete text area.
For the video, just alter the CSS to tell the video not to be silly:
<style>
.underlay {
z-index: -1;
}
.default, .underlay, #myvideo {
cursor: default;
}
</style>
I did do a piece on SVG custom cursors, based on https://css-tricks.com/using-css-cursors/.
Of course,
#myvideo {
cursor: none;
}
is also a possibility for those who hate cursors spoiling the view.
Acorn
Acorn - installed and active Xara software: Cloud+/Pro+, XDPXv18 , XWDPv12/v15, XPGDv10, X3D7, Xara Xtreme 5, and others back through time (to CC's Artworks).
Technical remediation and consultancy for your web designs. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy
I found some mouse-over swap images online and managed to reconstruct (very roughly this effect)
Attached.
Egg
Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host
If your looking for cursor changes you can create them yourself:
Egg
Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host
Yes, it works for me now too. My computers doing strange things lately!@Egg - tested the second version and it worked on desktop FF here.
Egg
Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host
Using the same method as the anchor swapsies I've created these two mouse over effects:
https://parkeston.com/tg/swapsies-hazard/
Egg
Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host
The second one
https://parkeston.com/tg/swapsies-ocean/
Egg
Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host
Interesting effect Egg with the video showing through on the cover image, but how is it done?
Reworked the "anchor" with your code, but tried another idea too > https://initiostar.co.uk/demo/eggAnchor/ - stopped short having the MouseOver turn-on/off the video/audio and stayed with the browser controls.
Bookmarks