메인 배너 로딩 속도

메인 배너 로딩 속도

QA

메인 배너 로딩 속도

본문



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <!--
        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
    -->
    <head>
        <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="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
        <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 : '/', },
                                                                                                            
                                                ]
                    
                });
            });
            
        </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>
<body>
    <!--Demo styles (you can delete this block)-->
    
    
    <!--End of styles-->
    <!--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>
    

</body>
</html>

 

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

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

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

어딘가가 잘못된건지.. 

 

이 질문에 댓글 쓰기 :

답변 1

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

lide_interval          :   4000,

transition_speed        :    700, 

시간도 조절해 보세요.

 

답변을 작성하시기 전에 로그인 해주세요.
전체 123,673 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT