‣‣
‣‣‣‣
‣‣‣
‣‣‣‣‣
‣‣‣
‣ 100 jQuery Plugins for Image Galleries with Source Files  (http://www.stunningmesh.com/2010/11/100-jquery-  plugins-for-...
‣‣‣ http://galleria.aino.se/
‣‣‣
‣‣ http://www.flickr.com/search/advanced/?
‣‣ http://galleria.aino.se/download/
‣‣              (http://goo.gl/DIaqA)<!DOCTYPE HTML><html> <head>  <meta charset="UTF-8" />  <title>My Image Gallery</titl...
‣
‣<!DOCTYPE HTML><html> <head>      <meta charset="UTF-8" />      <title>My Image Gallery</title>      <script src="http://...
‣
‣
‣<body> <div id="gallery">      <img src="img/6078870103_469c4a558a_b.jpg" />      <img src="img/6078870297_eb7103b1e8_b.j...
‣‣‣<body>  <div id="gallery">        <img src="img/6078870103_469c4a558a_b.jpg" />        <img src="img/6078870297_eb7103b...
‣‣<body>   <div id="gallery">         <img src="img/6078870103_469c4a558a_b.jpg" />         <img src="img/6078870297_eb710...
‣<!DOCTYPE HTML><html>  <head>        <meta charset="UTF-8" />        <title>My Image Gallery</title>        <script src="...
‣
‣‣‣‣‣‣
jQuery プラグイン1 - イメージギャラリーを作成する
Upcoming SlideShare
Loading in …5
×

jQuery プラグイン1 - イメージギャラリーを作成する

1,907
-1

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,907
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
14
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • jQuery プラグイン1 - イメージギャラリーを作成する

    1. 1. ‣‣
    2. 2. ‣‣‣‣
    3. 3. ‣‣‣
    4. 4. ‣‣‣‣‣
    5. 5. ‣‣‣
    6. 6. ‣ 100 jQuery Plugins for Image Galleries with Source Files (http://www.stunningmesh.com/2010/11/100-jquery- plugins-for-image-galleries-with-source-files/)‣ 20+ jQuery Image Gallery for your next project (http:// webexpedition18.com/articles/20-jquery-image-gallery- for-your-next-project/)‣ jQuery (http://otani- webs.com/blog/2010/06/gallery/)‣ jQuery 224 (http://kachibito.net/web-design/224-image-jquery- collection.html)
    7. 7. ‣‣‣ http://galleria.aino.se/
    8. 8. ‣‣‣
    9. 9. ‣‣ http://www.flickr.com/search/advanced/?
    10. 10. ‣‣ http://galleria.aino.se/download/
    11. 11. ‣‣ (http://goo.gl/DIaqA)<!DOCTYPE HTML><html> <head> <meta charset="UTF-8" /> <title>My Image Gallery</title> <script src="http://www.google.com/jsapi"></script> <script>google.load("jquery", "1");</script> </head> <body> </body></html>
    12. 12.
    13. 13. ‣<!DOCTYPE HTML><html> <head> <meta charset="UTF-8" /> <title>My Image Gallery</title> <script src="http://www.google.com/jsapi"></script> <script>google.load("jquery", "1");</script> <script src="galleria/galleria-1.2.5.min.js"></script> </head> <body> <script> if (Galleria) { $("body").text(Galleria works) } </script> </body></html>
    14. 14.
    15. 15.
    16. 16. ‣<body> <div id="gallery"> <img src="img/6078870103_469c4a558a_b.jpg" /> <img src="img/6078870297_eb7103b1e8_b.jpg" /> <img src="img/6081092566_3bd88e783d_b.jpg" /> <img src="img/6081783541_1b9408472a_b.jpg" /> <img src="img/6082318134_3f970f9706_b.jpg" /> <img src="img/6085378484_f6e479989c_b.jpg" /> </div> </body>
    17. 17. ‣‣‣<body> <div id="gallery"> <img src="img/6078870103_469c4a558a_b.jpg" /> <img src="img/6078870297_eb7103b1e8_b.jpg" /> <img src="img/6081092566_3bd88e783d_b.jpg" /> <img src="img/6081783541_1b9408472a_b.jpg" /> <img src="img/6082318134_3f970f9706_b.jpg" /> <img src="img/6085378484_f6e479989c_b.jpg" /> </div> <script> Galleria.loadTheme(galleria/themes/classic/galleria.classic.min.js); </script></body>
    18. 18. ‣‣<body> <div id="gallery"> <img src="img/6078870103_469c4a558a_b.jpg" /> <img src="img/6078870297_eb7103b1e8_b.jpg" /> <img src="img/6081092566_3bd88e783d_b.jpg" /> <img src="img/6081783541_1b9408472a_b.jpg" /> <img src="img/6082318134_3f970f9706_b.jpg" /> <img src="img/6085378484_f6e479989c_b.jpg" /> </div> <script> Galleria.loadTheme(galleria/themes/classic/galleria.classic.min.js); $("#gallery").galleria({ width: 960, height: 600 }); </script></body>
    19. 19. ‣<!DOCTYPE HTML><html> <head> <meta charset="UTF-8" /> <title>My Image Gallery</title> <script src="http://www.google.com/jsapi"></script> <script>google.load("jquery", "1");</script> <script src="galleria/galleria-1.2.5.min.js"></script> </head> <body> <div id="gallery"> <img src="img/6078870103_469c4a558a_b.jpg" /> <img src="img/6078870297_eb7103b1e8_b.jpg" /> <img src="img/6081092566_3bd88e783d_b.jpg" /> <img src="img/6081783541_1b9408472a_b.jpg" /> <img src="img/6082318134_3f970f9706_b.jpg" /> <img src="img/6085378484_f6e479989c_b.jpg" /> </div> <script> Galleria.loadTheme(galleria/themes/classic/galleria.classic.min.js); $("#gallery").galleria({ width: 960, height: 600 }); </script> </body>
    20. 20.
    21. 21. ‣‣‣‣‣‣
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×