Have a look at this FAQs page:
https://edgewebpages.com/faqs/
Look under:
Useful CSS Style for Slide Anything
Under the heading:
Instead of using slide link icons, make the entire slide clickable
thank. I managed.
Tell me, is it possible to make it so on all sliders?
not to insert a new slider code every time?
for example, I have 10 sliders on each page. and I insert 10 codes for each slider.
But can I make it so that I insert 1 code on all the slides?
Yes, instead of using your Slider CSS ID (‘#SLIDER_ID’), use the following class:
.sa_owl_theme
e.g.
.sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons { … }
I placed this code
but there was a link.
what’s wrong with the code?
.sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons { top:0px !important; left:0px !important; width:100% !important; height:100% !important; margin:0px !important; } .sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons a { width:100% !important; height:100% !important; background-image:none !important; background-color:transparent !important; } .sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons a:hover { background-color:rgba(0,0,0,0.1) !important; }
I think we need to try make the CSS ‘more specific’ – so try the following if you are using the ‘white’ colour scheme:
.white .sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons {
top:0px !important; left:0px !important; width:100% !important; height:100% !important; margin:0px !important; }
.white .sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons a {
width:100% !important; height:100% !important; background-image:none !important; background-color:transparent !important; }
.white .sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons a:hover {
background-color:rgba(0,0,0,0.1) !important; }
Or the following if you are using the ‘black’ colour scheme:
.black .sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons {
top:0px !important; left:0px !important; width:100% !important; height:100% !important; margin:0px !important; }
.black .sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons a {
width:100% !important; height:100% !important; background-image:none !important; background-color:transparent !important; }
.black .sa_owl_theme .owl-item .sa_hover_container .sa_hover_buttons a:hover {
background-color:rgba(0,0,0,0.1) !important; }
I tried 2 options. but still the link is visible.
https://prnt.sc/nnb6r3
this is my topic
https://ru.ww.wp.xz.cn/themes/wallstreet/
What code can be to remove the link?
I inserted this code. but did not help
.sa_owl_wallstreet .owl-item .sa_hover_container .sa_hover_buttons { top:0px !important; left:0px !important; width:100% !important; height:100% !important; margin:0px !important; }
.sa_owl_wallstreet .owl-item .sa_hover_container .sa_hover_buttons a { width:100% !important; height:100% !important; background-image:none !important; background-color:transparent !important; }
.sa_owl_wallstreet .owl-item .sa_hover_container .sa_hover_buttons a:hover { background-color:rgba(0,0,0,0.1) !important; }
I tried different ways, the link does not disappear.
.black .sa_owl_wallstreet-pro-child .owl-item .sa_hover_container .sa_hover_buttons {
top:0px !important; left:0px !important; width:100% !important; height:100% !important; margin:0px !important; }
.black .sa_owl_wallstreet-pro-child .owl-item .sa_hover_container .sa_hover_buttons a {
width:100% !important; height:100% !important; background-image:none !important; background-color:transparent !important; }
.black .sa_owl_wallstreet-pro-child .owl-item .sa_hover_container .sa_hover_buttons a:hover {
background-color:rgba(0,0,0,0.1) !important; }
.sa_owl_wallstreet-pro-child .owl-item .sa_hover_container .sa_hover_buttons { top:0px !important; left:0px !important; width:100% !important; height:100% !important; margin:0px !important; }
.sa_owl_wallstreet-pro-child .owl-item .sa_hover_container .sa_hover_buttons a { width:100% !important; height:100% !important; background-image:none !important; background-color:transparent !important; }
.sa_owl_wallstreet-pro-child .owl-item .sa_hover_container .sa_hover_buttons a:hover { background-color:rgba(0,0,0,0.1) !important; }
This is not going to work – I’m guessing that this class does not exist:
.sa_owl_wallstreet-pro-child
Please supply me with the link to the page you are having an issue with so I can have a look.
Try this:
.black .sa_owl_theme .owl-stage-outer .owl-stage .owl-item .sa_hover_container .sa_hover_buttons { ... }
.black .sa_owl_theme .owl-stage-outer .owl-stage .owl-item .sa_hover_container .sa_hover_buttons a.sa_slide_link_icon { ... }
.black .sa_owl_theme .owl-stage-outer .owl-stage .owl-item .sa_hover_container .sa_hover_buttons a.sa_slide_link_icon:hover { ... }
awesome! happened! links disappeared! THANKS!
I understand correctly, to change the color when you hover, you need to insert a color code here?
.black .sa_owl_theme .owl-stage-outer .owl-stage .owl-item .sa_hover_container .sa_hover_buttons a.sa_slide_link_icon:hover { background-color:rgba(0,0,0,0.1) !important; }
for example
RGB (rgb(81%, 19%, 75%, 1);
Glad you got this resolved 😉
correct, except the syntax is as follows:
rgba(RED,GREEN,BLUE,TRANSPARENCY)
RED, GREEN & BLUE are values between 0 and 255
TRANSPARENCY is a value between 0 and 1, e.g. 0.5
welcome I created a new slide. and the link is visible again. I already inserted the code to remove the link. How to remove the link on another slide? https://www.anilatur.ru/uncategorized/hello-world.html
second slider
