메인 배너 로딩 속도
본문
<!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초는 지나야 첫 이미지가 뜹니다..
어딘가가 잘못된건지..
답변을 작성하시기 전에 로그인 해주세요.