scrolling not jumping

Hi,
Ok, so you have a white circle that is a “Information graphic” that you want to show on a slider?
How about adding a slide to the slider that shows for 1 second? If you use the LayerSlider you can do this and make the “Information graphic” a link, if you wish. I think it can also be triggered by touch or click.

Best regards,
Mike

Hi,
I see, so you would like the Information graphic to show on mouse click. The layerslider includes buttons that you can use on the layers to link to slides. the reason I think this might work well is that the Information graphic will stay in a relevant location no matter the screen size.

Best regards,
Mike

Hi,
I took a look at your site and see that for some reason the layerslider was deactivated, you will need to activate it:

It is normally activated by default.

Best regards,
Mike

Hi,
The code (deactivate_layerslider) to disable the layerslider is a function which is also known a “theme support” when this “theme support” is in place the layerslider is not activate, so you want to remove it.
Thus the statement: “remove the theme support – deactivate_layerslider – to activate it”
But unfortunately the 3 rd option deletes the layerslider files at \enfold\config-layerslider so they will need to be added again via FTP. I have tried looking back but I don’t see the FTP access in this thread, if you add the ftp access I can assist.

Best regards,
Mike

Hi,
I have taken a look and what I see is that you have 2 one half columns for the top of the page, and then you are moving the images position, such as “left: 280px”
What I would recommend is creating 3 one third columns so the crosses are more naturally where you wanted them. Or you could try one full width column and “float” one cross to the left and one to the right. You can ensure that they stay in a single row by making them “display: inline-block” Either way they will each stay to the edge of the screen without moving their “position”.
Try making a test page with just the top elements so you can try this out, and let us know if you want some help with the css to achieve this.

Best regards,
Mike

Hi,
I took a look and the hover over the crosses seems a lot better now, but as you pointed out, just a little off. I see that you are using the columns as the link, instead of the cross image. I would use the images as the link, but I assume that you don’t want to hover background for the images or the green circle, so this should remove it:

#av_section_1 .kreuz_361 a:hover .image-overlay,#av_section_1 .kreuz_manufaktur a:hover .image-overlay {
    background: transparent !important; 
opacity: 0 !important;
}

Let us know if this helps. When you try the 1/1 version, I had a after thought that you might need to add display: inline-block to your css to line the two images up, but we’ll know more when you try.
One question, the two crosses are not in a line with the “moebel” text in the center, is this meant to be a straight line across?

Best regards,
Mike

Hi,
Very good, have a great night :)

Best regards,
Mike

Hi,
I took a look at the “MOEBEL” and adjusted the css to center it. Please clear your browser cache and check.

The correct css to hide the green arrow on the image is:

#manufaktur_weiche a:hover .image-overlay,#manufaktur_weiche a:hover .image-overlay {
    background: transparent !important; 
opacity: 0 !important;
}

Please try.

Best regards,
Mike