Panoramio Widget API

2013年3月6日水曜日

Panoramio Widget API(javascript)の貼り付けコード その４

前回の貼り付けコードをもう少しいじってみました。

  • 24行目　著作権表示部分の高さをheightに含めず、追加するにしました。
    widthとheightの値をアスペクト比に合わせるのが簡単になります。
  • 33，34行目　写真が1枚の時に不要な左右の矢印を非表示にしました。
view plainprint?
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <meta charset="UTF-8">  
  5. <title>Panoramio Widget API(JavaScript) sample</title>  
  6. </head>  
  7. <body>  
  8. <!-- bloggerのレイアウトでヘッダーの下へ追加(HTML/javaScript) -->  
  9. <script type="text/javascript" src="http://www.panoramio.com/wapi/wapi.js?v=1&hl=ja"></script>  
  10. <style type="text/css">   
  11.     .panoramio-wapi-photo .panoramio-wapi-images {   
  12.         background-color: #ffffff;   
  13. }   
  14. </style>   
  15. <!-- ここまで -->  
  16. <!-- 以下はブログの記事中にHTMLモードで記入 -->  
  17. <div id="d20130228A"></div>  
  18. <script type="text/javascript">  
  19. (function() {   
  20.     var wapiblock = document.getElementById('d20130228A');  
  21.     var myOptions = {  
  22.         'width': 360,  
  23.         'height': 240,  
  24.         'attributionStyle' : panoramio.tos.Style.DEFAULT_ADD,  
  25.         'openLinksInNewWindow': true  
  26.     };  
  27.     var photoRequestOptions = {  
  28.         ids: [  
  29.             {  'photoId': 85410010,  'userId': 1597930 }  
  30.         ]  
  31.     };  
  32.     var widget = new panoramio.PhotoWidget(wapiblock, photoRequestOptions, myOptions);  
  33.     widget.enableNextArrow(false);  
  34.     widget.enablePreviousArrow(false);  
  35.     widget.setPosition(0);  
  36. })();   
  37. </script>  
  38. <!-- ここまで -->  
  39. </body>  
  40. </html>  
投稿者 時刻:
ラベル:

0 件のコメント:

コメントを投稿

登録: コメントの投稿 (Atom)