I want to present one of my slideshows fullframe continuously in public. is there any way to get the pointer/hand out of sight?
as I will run it from a laptop with linux mint I have of course already set the pointer to its smallest size, but it is still big and disturbing. any idea?
X3Photo Gallery Forums
X3 Photo Gallery Support Forums
getting the pointer out of sight in slideshows
Last edited by ed_f on 25 Aug 2023, 07:08, edited 2 times in total.
Re: getting the pointer out of sight in slideshows
There is a way. Keep in mind, the cursor is rarely hidden in UI, because it could be very confusing for the user, unless the user knows what they are doing (for example yourself). If you navigate to Panel > Settings > Custom > Custom CSS, add this:
The above will make the cursor invisible when it's over the main image area. Keep in mind, it will become visible if you hover it directly over buttons, like in the topbar or the left/right navigation buttons.
Also, before you do this, consider the negative effects it may have for normal visitors to your website. I'm sure you would agree, if the mouse pointer vanishes for the user, they could get very confused and easily want to leave the website. Perhaps just add it temporarily?
Or restrict the hidden cursor to only fullscreen mode (fullscreen button top right is clicked)?
Code
.pswp__container {
cursor: none !important;
}Also, before you do this, consider the negative effects it may have for normal visitors to your website. I'm sure you would agree, if the mouse pointer vanishes for the user, they could get very confused and easily want to leave the website. Perhaps just add it temporarily?
Or restrict the hidden cursor to only fullscreen mode (fullscreen button top right is clicked)?
Code
.pswp:fullscreen .pswp__container {
cursor: none !important;
}Re: getting the pointer out of sight in slideshows
that was exactly what I hoped for, karl! but sadly it doesn't work. I tested both codes, but neither firefox nor edge show any changes - why?
this is how my code looks like:
this is how my code looks like:
Code
.fotorama__toggleplay {
top: 92%;
}.images figcaption .title {
font-weight: normal;
}
/* open-sans-300 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: local(''),
url('/fonts/open-sans-v34-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('/fonts/open-sans-v34-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* ubuntu-300 - latin */
@font-face {
font-family: 'Ubuntu';
font-style: normal;
font-weight: 300;
src: local(''),
url('/fonts/ubuntu-v20-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('/fonts/ubuntu-v20-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
.pswp:fullscreen .pswp__container {
cursor: none !important;
}Re: getting the pointer out of sight in slideshows
The bottom part of your CSS code is a bit messy ... You don't have a closing } bracket for the above @font-face{}, which would corrupt any CSS below it ...
Re: getting the pointer out of sight in slideshows
Leave some empty space between your classes so they are clear with opening and closing brackets {}
Code
.fotorama__toggleplay {
top: 92%;
}
.images figcaption .title {
font-weight: normal;
}
/* open-sans-300 - latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: local(''),
url('/fonts/open-sans-v34-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('/fonts/open-sans-v34-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* ubuntu-300 - latin */
@font-face {
font-family: 'Ubuntu';
font-style: normal;
font-weight: 300;
src: local(''),
url('/fonts/ubuntu-v20-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('/fonts/ubuntu-v20-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* It's good to add comments also / Remove cursor in popup in fullscreen move only */
.pswp:fullscreen .pswp__container {
cursor: none !important;
}Re: getting the pointer out of sight in slideshows
oh karl, now after I exchanged my code with yours (I have no idea of code!) I lost all my fonts, maybe because of the way I took them off of google (the german law-problem) - and still the cursor is visible! (I am working on the german version of my site)
please help me sorting that out quickly! thank you!
please help me sorting that out quickly! thank you!
- ccs.jpg (92.92 KiB) Viewed 11525 times
Re: getting the pointer out of sight in slideshows
to have at least the previous state back I now copied the code from the english version ...
Re: getting the pointer out of sight in slideshows
Hard to say what code you had before, but didn't you post it in your initial reply?
I checked your website, and I see the custom CSS code below. You have <!-- and -->, which has nothing to do there. Besides, I see nothing related to the code I posted for removing mouse cursor. And what about local fonts? They are loading ... This is what you posted in one of your posts in this topic.
I checked your website, and I see the custom CSS code below. You have <!-- and -->, which has nothing to do there. Besides, I see nothing related to the code I posted for removing mouse cursor. And what about local fonts? They are loading ... This is what you posted in one of your posts in this topic.
Code
<!-- .fotorama__toggleplay {top: 92%;}.images figcaption .title {font-weight: normal;}@font-face {font-family: 'Open Sans';font-style: normal;font-weight: 300;src: local(''), url('/fonts/open-sans-v34-latin-300.woff2') format('woff2'),url('/fonts/open-sans-v34-latin-300.woff') format('woff'); }@font-face {font-family: 'Ubuntu';font-style: normal;font-weight: 300;src: local(''), url('/fonts/ubuntu-v20-latin-300.woff2') format('woff2'),url('/fonts/ubuntu-v20-latin-300.woff') format('woff'); } -->Re: getting the pointer out of sight in slideshows
could you give a (german) time when we could work on it together, from monday on?
Re: getting the pointer out of sight in slideshows
I should be available from your early morning German time.
Re: getting the pointer out of sight in slideshows
ok now, good morning karl! once again I have exchanged my previous code with yours from #5 on my english site (you are probably the only one looking at it ;-). as you see (you may compare to the german version) my fonts vanished and the cursor is still visible in slideshows in full screen mode. would be nice to have both set. I'll get back to you when I got up, while for now I go to bed ;-) thanks for your help and have a good new week!
I cannot get the software to not change typewriter-smilies to these stupid yellow cookies ;-)
I cannot get the software to not change typewriter-smilies to these stupid yellow cookies ;-)
Re: getting the pointer out of sight in slideshows
It would be best if you could give me panel login so I can fix it from here. I can see that you only have the hide cursor CSS in one of the websites, and you still have <!-- --> in your CSS, which has nothing to do in CSS. As for the font, I need to check what settings you have in your panel, as it's difficult to see your settings by just looking at the websites. Also, did you follow this post for BOTH websites to replace the Google fonts loading?
Would be great if you could send panel logins by email karl @ photo.gallery.
Would be great if you could send panel logins by email karl @ photo.gallery.
Re: getting the pointer out of sight in slideshows
the cursor is now gone, but re-appears when needed. the best solution for fullscreen! :v: