TipBoard

[블로그] 혼살님의 티스토리블로그에 Highslide 설치와 사용법 본문

블로그/스킨

[블로그] 혼살님의 티스토리블로그에 Highslide 설치와 사용법

제갈선광 2015. 9. 17. 11:34

혼살님의 블로그에 올려진

'티스토리에 Highslide 설치하고 사용하는 방법을 소개합니다.


http://honsal.tistory.com/category/IT/Tistory?page=1

위 주소로 방문하시면 됩니다.





<head></head> 사이에 넣어야 하는 <script> 태그 부분

<!-- Highslide JS -->
 
    <script type="text/javascript" src="./images/highslide-full.js"></script>
    <link rel="stylesheet" type="text/css" href="./images/highslide.css">
    <!--[if lt IE 7]>
    <link rel="stylesheet" type="text/css" href="./images/highslide-ie6.css" />
    <![endif]-->
 
    <script type="text/javascript">
        hs.graphicsDir = './images/';
        hs.align = 'center';
        hs.transitions = ['expand', 'crossfade'];
        hs.fadeInOut = true;
        hs.dimmingOpacity = 0.8;
        hs.outlineType = 'rounded-white';
        hs.captionEval = 'this.thumb.alt';
        hs.marginBottom = 105; // make room for the thumbstrip and the controls
        hs.numberPosition = 'caption';
 
        // Add the slideshow providing the controlbar and the thumbstrip
        hs.addSlideshow({
            //slideshowGroup: 'group1',
            interval: 5000,
            repeat: false,
            useControls: true,
            overlayOptions: {
                className: 'text-controls',
                position: 'bottom center',
                relativeTo: 'viewport',
                offsetY: -60
            },
            thumbstrip: {
                position: 'bottom center',
                mode: 'horizontal',
                relativeTo: 'viewport'
            }
        });
    </script>
    <!-- End Highslide JS -->


0 Comments
댓글쓰기 폼