PHP & JavaScript Room :: 設置サンプル

実行結果

The jQuery Feed Menu | 設置サンプル

RSS Feeds

RSS Feeds:

テーマクラス



Transparent on Dark (for dark backgrounds)


Transparent on Light (for light backgrounds)

外部サイトなど、任意のRSSをフィードメニューに表示

設置サンプルのソース

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <meta http-equiv="Content-Language" content="ja" />
      <meta http-equiv="Content-Script-Type" content="text/javascript" />
      <meta http-equiv="Content-Style-Type" content="text/css" />
      <meta http-equiv="imagetoolbar" content="no" />
      <title>The jQuery Feed Menu | 設置サンプル</title>
      <link rel="alternate" type="application/rss+xml" title="RSS 1.0 (RDF)" href="http://phpjavascriptroom.com/index.rdf" />
      <link rel="alternate" type="application/rss+xml" title="RSS 2.0 (XML)" href="http://phpjavascriptroom.com/index.xml" />
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
        <script type="text/javascript" src="/content/lib/jquery_feed_menu/feed_menu.js"></script>
        <link rel="stylesheet" type="text/css" href="/content/lib/global.css" />
        <link rel="stylesheet" type="text/css" href="/content/lib/jquery_feed_menu/feed_menu.css" />
      <!--[if lte IE 7]>
         <link rel="stylesheet" type="text/css" href="/content/lib/jquery_feed_menu/feed_menu_ie.css" />
      <![endif]-->
      <script type="text/javascript">
         $ = jQuery;
      </script>
   <link rel="stylesheet" type="text/css" href="/common/css/example.css"></head>
   <body id='example3' class='example'><div class="ads" style="margin:32px auto;text-align:center;"></div><h1 class='h'><a href='/'>PHP &amp; JavaScript Room</a> :: 設置サンプル</h1>
<h3 class='h'>実行結果</h3>
      <div id="wrap">
         <h1><a href='http://www.komodomedia.com/blog/2008/10/jquery-feed-menus/'>The jQuery Feed Menu</a> | 設置サンプル</h1>
         <span id="jquery_feed_menu_example_1"></span>
         <script type="text/javascript">
         //<![CDATA[
            var fm = new FeedMenu();fm.write('#jquery_feed_menu_example_1');
         //]]>
         </script>

         <h2>RSS Feeds</h2>
         RSS Feeds: <span id="jquery_feed_menu_example_3"></span>
         <script type="text/javascript">
         //<![CDATA[
            var fm3 = new FeedMenu('link'+String.fromCharCode(91) +'type*=rss'+String.fromCharCode(93));
            fm3.write('#jquery_feed_menu_example_3');
         //]]>
         </script>

         <h2>テーマクラス</h2>
         <span id="jquery_feed_menu_example_8"></span>
         <script type="text/javascript">
         //<![CDATA[
            var fm8= new FeedMenu();
            fm8.write('#jquery_feed_menu_example_8');
         //]]>
         </script>
         <span id="jquery_feed_menu_example_4"></span>
         <script type="text/javascript">
         //<![CDATA[
            var fm4 = new FeedMenu(null,'wood');
            fm4.write('#jquery_feed_menu_example_4');
         //]]>
         </script>
         <span id="jquery_feed_menu_example_5"></span>
         <script type="text/javascript">
         //<![CDATA[
            var fm5 = new FeedMenu(null,'azure');
            fm5.write('#jquery_feed_menu_example_5');
         //]]>
         </script>

   <br><br>
         <span style="background:#111;padding:1em 0.5em;margin-right:0.5em;" class="jquery_feed_menu_example_6"></span>
         <span style="background:#666600;padding:1em 0.5em;margin-right:0.5em;" class="jquery_feed_menu_example_6"></span>
         <span style="background:#663300;padding:1em 0.5em;margin-right:0.5em;" class="jquery_feed_menu_example_6"></span>
         Transparent on Dark (for dark backgrounds)
         <script type="text/javascript">
         //<![CDATA[
            var fm6 = new FeedMenu(null,'trans_on_dark');
            fm6.write('.jquery_feed_menu_example_6');
         //]]>
         </script>
   <br><br><br>

         <span style="background:#DDD;padding:1em 0.5em;margin-right:0.5em;" class="jquery_feed_menu_example_7"></span>
         <span style="background:#33FFFF;padding:1em 0.5em;margin-right:0.5em;" class="jquery_feed_menu_example_7"></span>
         <span style="background:#FFCCFF;padding:1em 0.5em;margin-right:0.5em;" class="jquery_feed_menu_example_7"></span>
         Transparent on Light (for light backgrounds)
         <script type="text/javascript">
         //<![CDATA[
            var fm7= new FeedMenu(null,'trans_on_light');
            fm7.write('.jquery_feed_menu_example_7');
         //]]>
         </script>
   <br><br>

         <h2>外部サイトなど、任意のRSSをフィードメニューに表示</h2>
         <span id="jquery_feed_menu_example_9"></span>
         <script type="text/javascript">//<![CDATA[
            var oCustomLinks = [
               {
                  title:'RSS Feed',
                  href:"http://phpjavascriptroom.com/index.xml"
               },
               {
                  title:'Subscribe with Bloglines',
                  href:"http://www.bloglines.com/sub/http://feeds.feedburner.com/komodomedia"
               },
               {
                  title:'Subscribe with Google Reader',
                  href:"http://www.google.com/reader/view/feed/http://feeds.feedburner.com/komodomedia"
               }
            ];
            var fm9 = new FeedMenu(oCustomLinks);
            fm9.write('#jquery_feed_menu_example_9');
         //]]>
         </script>
      </div>
   </body>
</html>