class "not-animated" in Whale Slider of Theme "Pixel 2"
Permalink Browser Info Environment
Hi,
Grand Gallery is a cool tool, thanks for this. But I have a problem with it.
Using Pixel2-Theme and the Whale Slider: A page without a Gallery the slider works well:
HTML Without Grand Gallery:
<div class="slider-caption slider-caption-center" style="transform: translateY(0px); opacity:1.4625; top: 193px;">
<h3 class="fadeInUp animated" data-caption-animate="fadeInUp">Über uns</h3> <p class="hidden-xs- fadeInUp animated" data-caption-animate="fadeInUp" data-caption-delay="200">Ein verlässlicher Partner für Ihre Projekte</p>
</div>
On a page WITH one or more Galleries the h3- and p-Tags get a class "not-animated" resulting in that they are hidden (in CSS file .not-animated {opacity: 0;})
HTML With Grand Gallery
<div class="slider-caption slider-caption-center" style="transform: translateY(0px); opacity: 1.4625; top: 193.5px;">
<h3 class="not-animated" data-caption-animate="fadeInUp">Produkte</h3>
<p class="not-animated hidden-xs-" data-caption-animate="fadeInUp" data-caption-delay="200">Maximale Präzision - milimetergenaue Fertigung</p>
</div>
Any idea where the trigger for "not-animated" is located? Is it a "Gallery" or a "Pixel"-problem?
Kind regards
Arndt
Grand Gallery is a cool tool, thanks for this. But I have a problem with it.
Using Pixel2-Theme and the Whale Slider: A page without a Gallery the slider works well:
HTML Without Grand Gallery:
<div class="slider-caption slider-caption-center" style="transform: translateY(0px); opacity:1.4625; top: 193px;">
<h3 class="fadeInUp animated" data-caption-animate="fadeInUp">Über uns</h3> <p class="hidden-xs- fadeInUp animated" data-caption-animate="fadeInUp" data-caption-delay="200">Ein verlässlicher Partner für Ihre Projekte</p>
</div>
On a page WITH one or more Galleries the h3- and p-Tags get a class "not-animated" resulting in that they are hidden (in CSS file .not-animated {opacity: 0;})
HTML With Grand Gallery
<div class="slider-caption slider-caption-center" style="transform: translateY(0px); opacity: 1.4625; top: 193.5px;">
<h3 class="not-animated" data-caption-animate="fadeInUp">Produkte</h3>
<p class="not-animated hidden-xs-" data-caption-animate="fadeInUp" data-caption-delay="200">Maximale Präzision - milimetergenaue Fertigung</p>
</div>
Any idea where the trigger for "not-animated" is located? Is it a "Gallery" or a "Pixel"-problem?
Kind regards
Arndt
| Type: | Ticket |
|---|---|
| Status: | Archived |
Thank's a lot. Sent you a private message.
Try to reach slider author and ask how slider interact with other instances of swiper on site. Both blocks use swiper (though probably different version) as base for slider.
I can't really "read" .js file that adds "no-animated" class, because it is compressed. It would be my guess to look there first. I don't see any conflicts between both sliders beside lack of animation bug (which is custom code, not built-in function of swiper).
I can't really "read" .js file that adds "no-animated" class, because it is compressed. It would be my guess to look there first. I don't see any conflicts between both sliders beside lack of animation bug (which is custom code, not built-in function of swiper).
Attention: Since there has been no activity on this issue for two weeks, this issue has been automatically archived.
To re-open this issue, reply to this message.
To re-open this issue, reply to this message.
"not-animated "class comes from whale slider, so I would try there first.
Probably there are some css/js conflicts between addons or one of the blocks is too "greedy" with css class names etc.
You can send me link to page (where you have added both blocks) in private message, so I can check briefly if it isn't something "obvious" to fix.