테스트 사이트 - 개발 중인 베타 버전입니다

메인 배너 로딩 속도

에헤라디야 5년 전 조회 2,595

</p>

<p>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">" target="_blank" rel="noopener noreferrer">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"></a></p>

<p><html xmlns="<a href="http://www.w3.org/1999/xhtml"" target="_blank" rel="noopener noreferrer">http://www.w3.org/1999/xhtml"</a> xml:lang="en" lang="en"></p>

<p>    <!--

        Supersized - Fullscreen Slideshow jQuery Plugin

        Version : 3.2.4

        Site    : www.htmldrive.net

        

        Author    : Sam Dunn

        Company : One Mighty Roar (www.onemightyroar.com)

        License : MIT License / GPL License

    --></p>

<p>    <head></p>

<p>        <title>Supersized - Full Screen Background Slideshow jQuery Plugin</title>

        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />

        

        <link rel="stylesheet" href="css/supersized.css" type="text/css" media="screen" />

        <link rel="stylesheet" href="css/supersized.shutter.css" type="text/css" media="screen" />

        

        <script type="text/javascript" src="<a href="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>" target="_blank" rel="noopener noreferrer">https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script></a>

        <script type="text/javascript" src="js/jquery.easing.min.js"></script>

        

        <script type="text/javascript" src="js/supersized.3.2.4.min.js"></script>

        <script type="text/javascript" src="js/supersized.shutter.min.js"></script>

        

        <script type="text/javascript">

            

            jQuery(function($){

                

                $.supersized({

                

                    // Functionality

                    slide_interval          :   4000,        // Length between transitions

                    transition              :   1,             // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left

                    transition_speed        :    700,        // Speed of transition

                                                               

                    // Components                            

                    slide_links                :    'blank',    // Individual links for each slide (Options: false, 'number', 'name', 'blank')

                    slides                     :      [            // Slideshow Images

                                                        {image : '/theme/theme_v1/img/background/main_slide_img1.jpg', title : 'Image Credit: Maria Kazvan', thumb : '', },

                                                        {image : '/theme/theme_v1/img/background/main_slide_img3.jpg', title : 'Image Credit: Maria Kazvan', thumb : '/', },

                                                        {image : '/theme/theme_v1/img/background/main_slide_img2.jpg', title : 'Image Credit: Maria Kazvan', thumb : '/', },

                                                        {image : '/theme/theme_v1/img/background/main_slide_img4.jpg', title : 'Image Credit: Maria Kazvan', thumb : '/', },</p>

<p>                                                                                                            

                                                ]

                    

                });

            });

            

        </script>

        

    </head>

    

    <style type="text/css">

        ul#demo-block{ margin:0 15px 15px 15px; }

            ul#demo-block li{ margin:0 0 10px 0; padding:10px; display:inline; float:left; clear:both; color:#aaa;  font:11px Helvetica, Arial, sans-serif; }

            ul#demo-block li a{ color:#eee; font-weight:bold; }

    </style></p>

<p><body></p>

<p>    <!--Demo styles (you can delete this block)-->

    </p>

<p>    

    <!--End of styles--></p>

<p>    <!--Thumbnail Navigation-->

    <div id="prevthumb"></div>

    <div id="nextthumb"></div>

    

    <!--Arrow Navigation-->

    <style type="text/css">

        #prevslide, #nextslide{ position:absolute; height:50px; width:30px; top:50%; margin-top:-21px; opacity:0.6; }

                    #prevslide{ left:3%; background:url('/theme/theme_v1/img/back.png'); }

                    #nextslide{ right:3%; background:url('/theme/theme_v1/img/forward.png'); }

    </style>

    <a id="prevslide" class="load-item"></a>

    <a id="nextslide" class="load-item"></a>

    </p>

<p>

</body>

</html></p>

<p>

 

위 소스를 아이프레임으로 불러와서 메인에 배너를 뿌려주고 있습니다..

작동하는건 문제가 없는데 로딩하는데 시간이 너무 오래 걸리네요..

대충 세어봐도 4~5초는 지나야 첫 이미지가 뜹니다..

어딘가가 잘못된건지.. 

 

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

아이프레임으로 불러오기때문에 속도의 영향도 있을겁니다..

lide_interval          :   4000,

transition_speed        :    700, 

시간도 조절해 보세요.

 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인