인스타그램 피드 가져오기 그누보드에 적용중인데 잘 안되네욤 ㅠ

인스타그램 피드 가져오기 그누보드에 적용중인데 잘 안되네욤 ㅠ

QA

인스타그램 피드 가져오기 그누보드에 적용중인데 잘 안되네욤 ㅠ

본문


<style type="text/css">  
       #instaPics {  
            max-width: 320px;  
            overflow: hidden;  
       }  
       .insta-box {  
            position: relative;  
            width: 120px;  
            height: 120px;  
            float: left;  
            margin: 4px;  
            border: 1px solid #ddd;  
       }  
       .image-layer {  
            overflow: hidden;  
            width: 100%;  
            height: 100%;  
       }  
       .image-layer img {  
            max-width: 100%;  
       }  
       .caption-layer {  
            display: none;  
            position: absolute;  
            top: 0;  
            background: rgba(255,255,255,0.8);  
            height: 100%;  
            width: 100%;  
            padding: 10px;  
            box-sizing: border-box;  
            font-size: 10px;  
            color: #333;  
       }  
       .insta-likes {  
            float: right;  
       }  
       </style>

<div id="instaPics"></div>

<script type="text/javascript">  
   jQuery(function($) {  
        var tocken = "000"; /* Access Tocken 입력 */  
        var count = "6";  
        $.ajax({  
            type: "GET",  
            dataType: "jsonp",  
            cache: false,  
            url: "https://api.instagram.com/v1/users/self/media/recent/?access_token=" + tocken + "&count=" + count,  
            success: function(response) {  
             if ( response.data.length > 0 ) {  
                  for(var i = 0; i < response.data.length; i++) {  
                       var insta = '<div class="insta-box">';  
                       insta += "<a target='_blank' href='" + response.data[i].link + "'>";  
                       insta += "<div class'image-layer'>";  
                       //insta += "<img src='" + response.data[i].images.thumbnail.url + "'>";  
                       insta += '<img src="' + response.data[i].images.thumbnail.url + '">';  
                       insta += "</div>";  
                       //console.log(response.data[i].caption.text);  
                       if ( response.data[i].caption !== null ) {  
                            insta += "<div class='caption-layer'>";  
                            if ( response.data[i].caption.text.length > 0 ) {  
                                 insta += "<p class='insta-caption'>" + response.data[i].caption.text + "</p>"  
                            }  
                            insta += "<span class='insta-likes'>" + response.data[i].likes.count + " Likes</span>";  
                            insta += "</div>";  
                       }  
                       insta += "</a>";  
                       insta += "</div>";  
                       $("#instaPics").append(insta);  
                  }  
             }  
             $(".insta-box").hover(function(){  
                  $(this).find(".caption-layer").css({"backbround" : "rgba(255,255,255,0.7)", "display":"block"});  
             }, function(){  
                  $(this).find(".caption-layer").css({"display":"none"});  
             });  
            }  
           });  
   }); 
   </script>  

 

 

이라고 적용했는데요

 

토큰도 정상으로 받아서 입력했는데 그냉 하얀페이지만 나오네욤 ㅠㅠ

 

모가 문제일가요? 인스타그램 개발자 에서 모 환경설정을 해야되는지 ㅠ

이 질문에 댓글 쓰기 :

답변 1

현재 소스에서 보기에는 제이쿼리를 로드하고 있는 부분은 없는데요.

제이쿼리 버전은 현재 로드된 코드가 있나요?

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

회원로그인

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