• Priority: 0
  • Status: Closed
  • Theme: Alysum
  • Assigned To: Fred
  • Private: No
  • Open Date: 04.03.22, 10:37
  • Opened by: Eric Notarianni
  • Closed by: Fred
  • Closed on: 10.03.22, 13:23
  • Reason: Closed
  • Comment: Glad to help!

Ticket #23101 - STICKY HEADER PROBLEM

HELLO , Hope that you are well

i try to make my complete header sticky but it does not work
i have put in header settings the sticky at yes
i have defined a sticky class
i have modified the smart header to put on each column, section and elements the sticky class
but just my first line is sticky the others lines no are sticky and i need to have the complete header sticky

how to realize that please

Comments

Fred 04 Mar 2022, 19:49

you have to add sticky class to only one element, not to many

Eric Notarianni 05 Mar 2022, 13:16

hello sorry i have tried but this don’t work
for the moment i have created a sticky class in theme settings the sticky class is header-sticky

i have try to put on one element, this work just on the first line but not when i do the same thing for other lines

please look the problem i have the header-sticky on each section on each line, if i put just at the last line just the last line is sticky

please test it , i want all the header sticky, thanks to see in details

Eric Notarianni 05 Mar 2022, 20:09

i have put the same solution that you have for sticky amp , on the css
header {position: sticky;top: 0;z-index: 1}

and it S work it is correct to let this ?

Eric Notarianni 05 Mar 2022, 21:19

but i have a problem when i scroll there is a blank zone that appears , i have tried to see in the smart header but i can’t suppress this zone, please let me know if you see a solution

Eric Notarianni 06 Mar 2022, 23:57

the line where is the logo is not displayed and i have a blank line when i scroll down

Eric Notarianni 07 Mar 2022, 00:04

after to have suppress css , this work with just header {position: sticky;top: 0;z-index: 1}

do you think it is good ? if it is good for you , you can close this, thanks Fred

Eric Notarianni 07 Mar 2022, 01:05

But i have a problem of transparency when scroll down when there are products and some things also
products pass on the header but not under

Fred 07 Mar 2022, 11:49

But as I can see you have a header background https://take.ms/Tro1A

Eric Notarianni 07 Mar 2022, 12:09

i have suppress the header background and i have the same problem, look at this page https://boutique.idms.fr/19-alarme and scroll down to put the products up please to see the problem

Eric Notarianni 07 Mar 2022, 16:10

on this url look please also the problem of these animated circles on some products who have transparency always moving what it is due? is like this something can’t be charged, please let me know also for this

Fred 08 Mar 2022, 11:05

Try this CSS fix

#header {z-index:99}
body img {background:none}
Eric Notarianni 08 Mar 2022, 11:54

yes good !! it works for the products now they don’t display on the header !!! congratulations Alex !

and have you an idea for these animated circles that we see on images products for exemple on this page https://boutique.idms.fr/19-alarme you see on transparency these circles moving, this is just on multiple products views , how to eliminate these cirecles please

Fred 09 Mar 2022, 01:16

this code removes loaders

body img {background:none !important}
Eric Notarianni 09 Mar 2022, 08:31

hello Fred, i have put this code, but always the moving circles are here on https://boutique.idms.fr/19-alarme. and others urls.
i have also another problem ,i have put in the header a test for animate a section, but now in creative elements , i can’t see this section now to modify it and change this animation to stop this

Eric Notarianni 09 Mar 2022, 10:20

HELLO FRED ALL IS SOLVED THANKS A LOT YOU CAN CLOSE THIS TICKET !!

Fred 10 Mar 2022, 13:23

Ok, glad you solved the issue.