0

I'm using the Slick slider in my theme https://kenwheeler.github.io/slick/ and Material design lite https://getmdl.io/

Problem I am having is that the transforms used here are conflicting with the Wordpress admin bar and causing it to disappear. If I comment these out it works better, but still disappears if the slide is in transition to the next slide. 

.slick-slider .slick-list, .slick-slider .slick-track {
-webkit-transform: translate3d(0,0,0);
-ms-transform: translate3d(0,0,0);
-o-transform: translate3d(0,0,0);
 transform: translate3d(0,0,0);

}

I've tried setting useTransform to false on slick but that didn't help.

Improve this question
2
  • Try adjusting the admin bar z-index so it and the drop downs are in front of the slider.
    – Andy Macaulay-Brook
    Commented Sep 29, 2016 at 20:07
  • Cool. If you move the solution into an answer that'll keep the site format tidy. In a couple of days you can accept your own answer too.
    – Andy Macaulay-Brook
    Commented Sep 29, 2016 at 20:18

2 Answers 2

Reset to default
1

Adding a css rule for #wpadminbar:

transform: translate3d(0,0,0);
background: black;
width: 100%;

Makes the bar appear and

I added z-index: 0; to .mdl-layout__header to make the dropdowns appear.

Not the prettiest.

Improve this answer
0

insert this into your style.css:

body #wpadminbar{z-index:99;}

and maybe this solves.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.