Сначала загружаются изображения ползунков Revolution, а затем появляется только ползунок

Question

Сначала загружаются изображения ползунков Revolution, а затем появляется только ползунок

0

Я создаю сайт с помощью слайдера Revolution, но изображения слайдера загружаются в первую очередь и после того, как все загружается, тогда работает только слайдер.

Перед тем, как слайдер загрузится, он выглядит некрасиво, чтобы сразу увидеть все изображения...

Я уже пробовал с mulitple css изменениями, но ничего не работало.

http://livedesignstudios.com/glor-original/

<div class="fullwidthbanner-container">
                    <div class="fullwidthbanner">
                        <ul>
                            <!-- THE FIRST SLIDE -->
                            <li data-transition="fade" data-slotamount="1" data-masterspeed="500" data-thumb="images/thumbs/thumb3.jpg">
                                        <img alt="glow" title="designova" src="images/slides/slide5_wide.jpg" >

                                        <div class="caption modern_big_bluebg lfb"  
                                             data-x="380" 
                                             data-y="60" 
                                             data-speed="500" 
                                             data-start="1500" 
                                             data-easing="easeOutExpo">The Pocket Computer</div>
                                        <div class="caption modern_small_text_dark sfb"  
                                             data-x="420" 
                                             data-y="110" 
                                             data-speed="500" 
                                             data-start="1800" 
                                             data-easing="easeOutExpo">USB OS made for Children but <br>Good enough for Military</div>
                                        <div class="caption lfl"  
                                            data-x="480" 
                                            data-y="170" 
                                            data-speed="500" 
                                            data-start="2100" 
                                            data-easing="easeOutExpo" ><img alt="downloadfree" title="downloadfree" src="images/slides/downloadfree.png"></div>         

</div>              
                            </li>

Khirthan 30 нояб. 2013, в 07:03

Источник

Теги:

jquery

slider

3 ответа

Ещё вопросы

user3515900 · Answer 1 · 2015-12-15T21-51-00.000Z

Мне удалось исправить эту проблему, установив opacity: 0; используя встроенный стиль на первом изображении.

Спасибо @RamsaySmith за ваш уточненный ответ ... хотя я не уверен, как я могу вам за это поверить. Могу ли я сделать что-то еще здесь? Я просто изменил свой ответ на исправленный.
Я боролся за то же самое. И вдруг пришел к вашему предложению. Спасибо за чаевые.

Arleigh Robert Renard Dickerso · Answer 2 · 2015-01-10T21-37-00.000Z

Похоже, вы закрыли свой div, прежде чем закрыли свой ли.

    <div class="fullwidthbanner">
        <ul>
            <!-- THE FIRST SLIDE -->
            <li data-transition="fade" data-slotamount="1" data-masterspeed="500" data-thumb="images/thumbs/thumb3.jpg"><img alt="glow" title="designova" src="images/slides/slide5_wide.jpg">

                <div class="caption modern_big_bluebg lfb" data-x="380" data-y="60" data-speed="500" data-start="1500" data-easing="easeOutExpo">The Pocket Computer</div>
                <div class="caption modern_small_text_dark sfb" data-x="420" data-y="110" data-speed="500" data-start="1800" data-easing="easeOutExpo">
                    USB OS made for Children but <br>Good enough for Military
                </div>
                <div class="caption lfl" data-x="480" data-y="170" data-speed="500" data-start="2100" data-easing="easeOutExpo">
                    <img alt="downloadfree" title="downloadfree" src="images/slides/downloadfree.png">
                </div>
            </li>
        </ul>
    </div>

Также попробуйте изменить порядок загрузки сценариев. У меня была аналогичная проблема из-за загрузки кучу других скриптов, прежде чем я загрузил javascript с революционным слайдером.

ZiGO_X · Answer 3 · 2014-02-19T09-50-00.000Z

$(".fullwidthbanner").hide();
$(".fullwidthbanner").delay(100).fadeIn(0);