11.Nas_1


새창 작성 수정 목록 링크 Edit G카랜다 HDD HDD HDD 게시물 주소 복사


작업중_실패)PDF를 웹으로 볼수 있는 Google Docs Viewer plugin for jQuery 첨부 파일 pc/모바일 모두 pdf보기 가능

♨ 카랜더 일정 :
  • 링크

  • 첨부

  • 컨텐츠 정보

    본문

    PDF를 웹으로 볼수 있는 Google Docs Viewer plugin for jQuery  첨부 파일 pc/모바일 모두 pdf보기 가능

    Google Docs Viewer plugin for jQuery

    Here's a little jQuery plugin I wrote recently that automatically embeds the Google Docs Viewer for viewing pdf, doc, docx, ppt and tiff files linked to by anchor tags.


    The Google Docs Viewer is an embeddable browser-based viewer that requires only a URL to a file available online.

    This neatly bypasses the need for users to have compatible software on their machines for those file types and displays the document right in the browser.


    Usage


    1. Add jQuery and the gDocsViewer plugin to the page.

    1.

    <head>

    2.

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

    3.

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

    4.

    </head>


    2. Set some class name or id to the anchor tag for all URLs to files that you want to be displayed using the Google Docs Viewer. E.g. "embed"

    1.

    <a href="urltofile.pdf" class="embed">Download file</a>

    1.

    <a href="urltofile.pdf" id="embedURL">Download file</a>


    3. Initialize gDocsViewer and set it to process the URL with id or all URLs with the class name set in the previous step.

    1.

    $('a.embed').gdocsViewer();

    1.

    $('#embedURL').gdocsViewer();


    Customization


    The plugin offers two configuration options that set the width and height of the embedded document IFRAME. This can be set when the plugin is initialized.

    1.

    $('a.embed').gdocsViewer({ width: 400, height: 500 });


    The plugin inserts a the IFRAME for the viewer inside an injected DIV. The DIV tags all carry the class name "gdocsviewer",
    which allow for styling all the gdocsViewer instances via CSS. If the anchor tag has the ID attribute defined,

    then the injected DIV tag is also set an ID attribute in the format of ID_of_Anchor + '-gdocsviewer'. See the demo source code for more details.


    Demo


    - Check out the live demonstration


    License

    This script is released under the Open Source MIT License, allowing its use in both personal and commercial applications as long as the copyright and license permission notice remains intact.


    Download

    - jquery.gdocsviewer.v1.0.zip (v1.0, 2.2KB)


    Enjoy!

    This entry was posted by Jaa on Monday, February 21. 2011 at 19:00. You can leave a response, or trackback from your own blog.

    Defined tags for this entry: gdocsviewer, google docs viewer, javascript, jquery, plugin, projects, release

    Related entries by tags: Dhivehi Phonetic (with Naviyani) Keyboard Installer for Windows Filibari Keyboard for Thaana Moment.

    js Dhivehi locale merged Dhist launched! Integrating JTK with tinyMCE 4.x

    Email this • Share on Facebook • Digg This! • Save to del.icio.us • AddThis!


    Trackbacks

    Trackback specific URI for this entry

    No Trackbacks

    Comments

    Display comments as (Linear | Threaded)

    3232235521_1517405373.3121.png


    <!-- 11q.kr 첨부된 gdocsViewer 영역 시작입니다 20180131-->
    <!-- view.skin.php의 하단 적당한 위치에 소스 복사 및 /mw.js/ 또는 폴더 경로복사 /수정후 jquery.gdocsviewer.min.js 파일 복사 먼저 하세요 -->
    <head>
    <title>gDocsViewer pdf Demo</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script> 
    <script type="text/javascript" src="<?=$board_skin_path?>/mw.js/jquery.gdocsviewer.min.js"></script> 

    <style type="text/css">
    /* Style the second URL with a red border */
    #test-gdocsviewer {
    border: 5px red solid;
    padding: 20px;
    width: 500px;
    background: #ccc;
    text-align: center;
    }
    /* Style all gdocsviewer containers */
    .gdocsviewer {
    margin:10px;
    }
    </style>
    <script type="text/javascript"> 
    /*<![CDATA[*/
    $(document).ready(function() {
    $('a.embed').gdocsViewer({width: 400, height: 400});
    $('#embedURL').gdocsViewer();
    });
    /*]]>*/
    </script> 
    </head>
    <body style="background:#999; font-family:arial, helvetica, sans-serif; font-size:14px;">

    <hr size="1" />
    <div>
            <a href="<?php echo $view['file'][0]['path'];?>/<?php echo $view['file'][0]['file'];?>" class="embed">gdocsViewer 첨부1 </a>
    <a href="<?php echo $view['file'][1]['path'];?>/<?php echo $view['file'][1]['file'];?>" class="embed">gdocsViewer 첨부2 </a>
    </div>
    </div>
    </body>

    <!-- 11q.kr 첨부된 gdocsViewer 영역 시작입니다 - 추가끝 입니다 -->

    주)  본자료는 시현했으나  저의 시스템  모바일에서  안되서
          공부중 입니다

    [ 추가 정보 ... 더보기) ]
    뷰PDF 1,2



    office view

    관련자료

    댓글목록

    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.165.205) 작성일

    서버에 파일을 다운로드하기 위해서해야 할 일은 다음과 같습니다.

    https://stackoverflow.com/questions/3938534/download-file-to-server-from-url

    file_put_contents("Tmpfile.zip", file_get_contents("http://someurl/file.zip"));
    단 하나의 문제가 있습니다. 100MB와 같은 큰 파일이 있다면 어떨까요? 그런 다음 메모리가 부족하여 파일을 다운로드 할 수 없습니다.

    내가 원하는 것은 파일을 다운로드 할 때 디스크에 파일을 쓰는 방법입니다. 그렇게하면 메모리 문제가없이 더 큰 파일을 다운로드 할 수 있습니다.

    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.165.174) 작성일
    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.165.174) 작성일
    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.164.233) 작성일

    pc모드 (크롬브라우즈)에서  보이지 않네요

    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.164.233) 작성일
    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.165.185) 작성일

    첨부1의 경로와 파일이름
    <?php echo $view['file'][0]['path'];?>/<?php echo $view['file'][0]['file'];?>

     첨부2의 경로와 파일이름
     <?php echo $view['file'][1]['path'];?>/<?php echo $view['file'][1]['file'];?>


    echo "<a href='{$view[file][$i][path]}/{$view[file][$i][file]}'>";
    이렇게 한번 해보세요..

    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.165.185) 작성일
    profile_image

    돌돌이아빠님의 댓글

    no_profile 돌돌이아빠 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 아이피 (112.♡.5.46) 작성일

    감사합니다.^^

    profile_image

    shimss11q님의 댓글의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.203.244) 작성일

    본자료는  pc 에서는 시현했으나    모바일에서  안되서 공부중 입니다

    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.203.244) 작성일
    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.203.238) 작성일
    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (223.♡.203.238) 작성일
    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (210.♡.41.89) 작성일

    업로드확장자 추출하기
    http://sexy.pe.kr/tc/88

    profile_image

    shimss11q님의 댓글

    shimss11q 쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물 아이피 (210.♡.41.89) 작성일

    첨부파일 시 확장자 체크 (이미지 체크)
    https://sir.kr/g4_tiptech/21438

    목록

    새창 작성 수정 목록 링크 Edit G카랜다 HDD HDD HDD 게시물 주소 복사


    • 일간 조회수
        • 게시물이 없습니다.
    • 주간 조회수
        • 게시물이 없습니다.
    • 월간 조회수
        • 게시물이 없습니다.


    Total 1,689 / 13 Page
    [ 헤놀로지 DSM 6.2.3-25426 update 진행 ]

    헤놀로지 DSM 6.2.3-25426 update 진행http://www.2cpu.co.kr/nas/28294#c_28445어제 6.2.3으로 …

    [ xpenology ssh puttry로 mount 하여 Booting USB sn,mac 주소 직접 간편… ] 댓글 2

    xpenology ssh puttry로 mount 하여 Booting USB sn,mac 주소 직접 간편하게마운트하여 편집하기root@ss11q…

    [ 리눅스 cp - 복사 백업 하기 ]

    리눅스 cp - 복사먼저 copy 하고자 하는 디랙토리를 만든다mkdir/volume1/web/ww원본/volume1/web/g5s 를 카피 하…

    [ 스킨 종료명령과 스킨 메뉴 먹통시 메뉴 초기화 방법및 파워 사용자메뉴 만들기 ] 댓글 1

    스킨 종료명령과 스킨 메뉴 먹통시 메뉴 초기화 방법및 파워 사용자메뉴 만들기http://11q.kr/g5s/bbs/board.php?bo_ta…

    [ 작업중)iptime entware 설치 작업 이전에 설치되었는데 오늘 다시 작업 하니 설치가 되지 않네요 ]

    iptime entware 설치 작업이전에 설치되었는데 오늘 다시 작업 하니 설치가 되지 않네요usb를 다시 포멧 합니다usb 메모리를 포멧 잘…

    [ 펌정보)웹폰트 적용에서 최적화까지 ] 댓글 2

    펌정보)웹폰트 적용에서 최적화까지unicode-range속성Permalinkunicode-range속성을 이용하면 특정 문자열만 웹폰트로 지정할…

    [ ● Synology-NAS 시놀로지 포트 번호 정리 및 사용중인 내장 포트 방화벽 허용 적용 ]

    ● Synology-NAS 시놀로지 포트 사용중인 내장 포트 방화벽 허용 적용● Synology-NAS 시놀로지 포트 번호 정리 1. 설정 유틸…

    [ Synology NAS에 IPKG Easy Bootstrap nano edit ipkg 를 설치하는 방법 ]

    ●Synology NAS에 IPKG를 설치하는 방법Synology 패키지 센터로 이동하여 오른쪽 상단 모서리에 있는 " 설정 "을 클릭한 다음 …

    [ ● esxi의 putty로 ssh 설치 로 터미널 접속하기 ]

    ● esxi의 putty로 ssh 설치 로 터미널 접속하기 호스트 > 작업 > 서비스 > ssh 사용으로 변경 ▶ putty 로…

    [ ● 헤놀로지 부트로더 Redpill Driver 추가 방법 ]

    ● 헤놀로지 부트로더Redpill Driver 추가 방법https://blog.dateno1.com/?p=3993#comment-457하기 내용…

    [ ● redpill boot loader build 작업 에러 대응 펌 정보 및 starwindconv… ] 댓글 3

    아래내용은 저의 삽질 내용이며 우분투 영어 언어로 재설치 이상 없습니다------------------● 최종재설치)ESxi 서버에 우분투 설치…

    [ ● 시놀로지 nas 서버의 정보 및 홈페이지 정보 카카오 톡 알림 받기 ]

    ● 시놀로지 nas서버의 정보 및 홈페이지 정보 카카오 톡 알림 받기 1) 기본 설정은 메일 설정 진행 2) 카카오 메일수신 친구추가 진행3) …

    [ ● vCenter 없이 ESXi 6.7을 7.0으로 업그레이드하는 방법 ]

    ESXi 7.0에서 지원되지 않는 공급업체 하드웨어 VIB가 호스트에 설치되어 있을 수 있으므로 이러한 VIB가 업그레이드 프로세스를 차단할 수…

    [ ● 빌드 자동파일 sh 구성 )헤놀로지 RedPill tinyCore 만능부트로더 for Native img… ] 댓글 4

    ● 빌드 자동파일 sh 구성 )헤놀로지 RedPill tinyCore 만능부트로더 for Native img 적용파일 및 수정하기 첨부tinyc…

    [ ● esxi ESXi에 대한 SNMP 구성 시작 설정하기 ]

    ●esxiESXi에 대한 SNMP 구성 시작 설정하기ESXi에 대한 SNMP 구성라이브러리에 추가PDF 다운로드피드백업데이트 날짜:2019년05…

    [ ● VMware ESXi 호스트 구성 백업 및 복원: 단계별 가이드 ]

    ●VMware ESXi 호스트 구성 백업 및 복원: 단계별 가이드https://www.nakivo.com/vmware-backup/back-up…

    [ ●esxi서버메인보드mainboard[GIGABYTE] B560M AORUS PRO 시스템 의 메뉴얼및 데디… ] 댓글 5

    ●esxi서버메인보드mainboard[GIGABYTE] B560M AORUS PRO 시스템 의 메뉴얼및 데디타 쉬트(data sheet) 분석및…

    [ ● 동기화 Syncthing를 시놀로지 도커에서 설치 pc 핸드폰 폴더 공유하기 ] 댓글 2

    ● 동기화Syncthing를 시놀로지도커에서 설치 pc 핸드폰 photo 폴더 공유하기Syncthing은 기존의 사유(私有) 동기화 / 클라우드…


    ♥간단_메모글♥


    최근글


    새댓글



    PHP 안에 HTML ☞ 홈페이지 화면갱신 시간은 ♨
    ▶ 2025-07-06 08:39:57

    오늘의 홈 현황


    • 현재 접속자♨ 579 명
    • 오늘 가입자※ 0 명
    • 어제 가입자※ 3 명
    • 주간 가입자※ 12 명
    • 오늘 방문자 26,034 명
    • 어제 방문자 91,941 명
    • 최대 방문자 122,350 명
    • 전체 방문자 6,350,396 명
    • 전체 게시물※ 9,029 개
    • 전체 댓글수※ 25,721 개
    • 전체 회원수 11,730 명

    QR코드


    ☞ QR코드 스캔은 kakao앱 자체 QR코드

    알림 0








    최신글↑