|
|
Line 1: |
Line 1: |
| {{Team:HokkaidoU_Japan/header}} | | {{Team:HokkaidoU_Japan/header}} |
- |
| |
- | {{Team:HokkaidoU_Japan/top}}
| |
- |
| |
- | <html>
| |
- | <script type="text/javascript">
| |
- | $(function(){
| |
- | $('#lofslidecontent45').lofJSidernews({
| |
- | interval : 4000,
| |
- | easing : 'easeInOutQuad',
| |
- | duration : 1200,
| |
- | auto : false,
| |
- | maxItemDisplay : 3,
| |
- | startItem : 1,
| |
- | navPosition : 'horizontal',
| |
- | navigatorHeight : 15,
| |
- | navigatorWidth : 25,
| |
- | mainWidth : 900
| |
- | });
| |
- | });
| |
- | </script>
| |
- | <style>
| |
- | .lof-slidecontent, .lof-slidecontent a {
| |
- | color:#FFF;
| |
- | }
| |
- | .lof-slidecontent a.readmore{
| |
- | color:#58B1EA;
| |
- | font-size:95%;
| |
- |
| |
- | }
| |
- | .lof-slidecontent{
| |
- | position:relative;
| |
- | overflow:hidden;
| |
- | border:#F4F4F4 solid 1px;
| |
- | }
| |
- | .lof-slidecontent .preload{
| |
- | height:100%;
| |
- | width:100%;
| |
- | position:absolute;
| |
- | top:0;
| |
- | left:0;
| |
- | z-index:100000;
| |
- | text-align:center;
| |
- | background:#FFF
| |
- | }
| |
- | .lof-slidecontent .preload div{
| |
- | height:100%;
| |
- | width:100%;
| |
- | background:transparent url(../images/load-indicator.gif) no-repeat scroll 50% 50%;
| |
- | }
| |
- | .lof-main-outer{
| |
- | position:relative;
| |
- | height:100%;
| |
- | width:900px;
| |
- | z-index:3px;
| |
- | overflow:hidden;
| |
- | }
| |
- |
| |
- |
| |
- | /*******************************************************/
| |
- | .lof-main-item-desc{
| |
- | z-index:100px;
| |
- | position:absolute;
| |
- | bottom:50px;
| |
- | left:0px;
| |
- | width:350px;
| |
- | background:url(../images/bg_trans.png);
| |
- | height:100px;
| |
- | /* filter:0.7(opacity:60) */
| |
- | padding:10px;
| |
- | }
| |
- | .lof-main-item-desc p{
| |
- | margin:0 8px;
| |
- | padding:8px 0
| |
- | }
| |
- | .lof-main-item-desc h3{
| |
- | padding:0;
| |
- | margin:0
| |
- | }
| |
- | .lof-main-item-desc h2{
| |
- | padding:0;
| |
- | margin:15px 0 0 0px;
| |
- | }
| |
- | .lof-main-item-desc h3 a{
| |
- | margin:0;
| |
- | background:#C01F25;
| |
- | font-size:75%;
| |
- | padding:2px 3px;
| |
- | font-family:"Trebuchet MS",Trebuchet,Arial,Verdana,sans-serif;
| |
- | text-transform:uppercase;
| |
- | text-decoration:none
| |
- | }
| |
- | .lof-main-item-desc h3 a:hover{
| |
- |
| |
- | text-decoration:underline;
| |
- | }
| |
- | .lof-main-item-desc h3 i {
| |
- | font-size:70%;
| |
- | }
| |
- |
| |
- | /* main flash */
| |
- | ul.lof-main-wapper{
| |
- | /* margin-right:auto; */
| |
- | overflow:hidden;
| |
- | background:transparent url(../images/load-indicator.gif) no-repeat scroll 50% 50%;
| |
- | padding:0px;
| |
- | margin:0;
| |
- | position:absolute;
| |
- | overflow:hidden;
| |
- | }
| |
- |
| |
- | ul.lof-main-wapper li{
| |
- | overflow:hidden;
| |
- | padding:0px;
| |
- | margin:0px;
| |
- | float:left;
| |
- | position:relative;
| |
- | }
| |
- | .lof-opacity {
| |
- | overflow:visible !important;;
| |
- | position:absolute !important;
| |
- | }
| |
- | .lof-opacity li{
| |
- | position:absolute !important;;
| |
- | top:0;
| |
- | left:0;
| |
- | float:inherit !important;
| |
- | }
| |
- | ul.lof-main-wapper li img{
| |
- | padding:0px;
| |
- | }
| |
- |
| |
- | /* item navigator */
| |
- | .lof-navigator-wapper {
| |
- | position:absolute;
| |
- | bottom:10px;
| |
- | right:10px;
| |
- | background:#000;
| |
- | padding:5px 15px;
| |
- | -moz-border-radius:5px 5px 5px 5px;
| |
- |
| |
- | }
| |
- | .lof-navigator-outer{
| |
- | position:relative;
| |
- | z-index:100;
| |
- | height:180px;
| |
- | width:310px;
| |
- | overflow:hidden;
| |
- | color:#FFF;
| |
- | float:left
| |
- | }
| |
- | ul.lof-navigator{
| |
- | top:0;
| |
- | padding:0;
| |
- | margin:0;
| |
- | position:absolute;
| |
- | width:100%;
| |
- | }
| |
- | ul.lof-navigator li{
| |
- | cursor:hand;
| |
- | cursor:pointer;
| |
- | list-style:none;
| |
- | padding:0;
| |
- | margin-left:0px;
| |
- | overflow:hidden;
| |
- | float:left;
| |
- | display:block;
| |
- | text-align:center;
| |
- |
| |
- | }
| |
- | ul.lof-navigator li.active , ul.lof-navigator li:hover {
| |
- | background:#FFF;
| |
- | color:#000;
| |
- | display:block;
| |
- | }
| |
- | </style>
| |
- | <div id="lofslidecontent45" class="lof-slidecontent" style="width:900px; height:340px;">
| |
- | <div class="preload"><div></div></div>
| |
- | <div class="lof-main-outer" style="width:900px; height:340px;">
| |
- | <ul class="lof-main-wapper">
| |
- | <li>
| |
- | <img src="images/thumbl_980x340.png" title="Newsflash 2" >
| |
- | <div class="lof-main-item-desc">
| |
- | <h3><a target="_parent" title="Newsflash 1" href="#Category-1">/ Newsflash 1 /</a> <i> — Monday, February 15, 2010 12:42</i></h3>
| |
- | <h2>Content of Newsflash 1</h2>
| |
- | <p>The one thing about a Web site, it always changes! Joomla! makes it easy to add Articles, content,...
| |
- | <a class="readmore" href="#">Read more </a>
| |
- | </p>
| |
- | </div>
| |
- | </li>
| |
- | <li>
| |
- | <img src="images/thumbl_980x340_002.png" title="Newsflash 1" >
| |
- | <div class="lof-main-item-desc">
| |
- | <h3><a target="_parent" title="Newsflash 2" href="#Category-2">/ Newsflash 2 /</a> <i> — Monday, February 15, 2010 12:42</i></h3>
| |
- | <h2>Content of Newsflash 2</h2>
| |
- | <p>Joomla! makes it easy to launch a Web site of any kind. Whether you want a brochure site or you are...
| |
- | <a class="readmore" href="#">Read more </a>
| |
- | </p>
| |
- | </div>
| |
- | </li>
| |
- | <li>
| |
- | <img src="images/thumbl_980x340_003.png" title="Newsflash 3" >
| |
- | <div class="lof-main-item-desc">
| |
- | <h3><a target="_parent" title="Newsflash 3" href="#Category-3">/ Newsflash 3 /</a> <i> — Monday, February 15, 2010 12:42</i></h3>
| |
- | <h2>Content of Newsflash 3</h2>
| |
- | <p>With a library of thousands of free Extensions, you can add what you need as your site grows. Don't...
| |
- | <a class="readmore" href="#">Read more </a>
| |
- | </p>
| |
- | </div>
| |
- | </li>
| |
- | <li>
| |
- |
| |
- | <img src="images/thumbl_980x340_004.png" title="Newsflash 5" >
| |
- | <div class="lof-main-item-desc">
| |
- | <h3><a target="_parent" title="Newsflash 4" href="#Category-4">/ Newsflash 4 /</a> <i> — Monday, February 15, 2010 12:42</i></h3>
| |
- | <h2>Content of Newsflash 4</h2>
| |
- | <p>Joomla! 1.5 - 'Experience the Freedom'!. It has never been easier to create your own dynamic Web...
| |
- | <a class="readmore" href="#">Read more </a>
| |
- | </p>
| |
- | </div>
| |
- | </li>
| |
- |
| |
- | <li>
| |
- |
| |
- | <img src="images/thumbl_980x340_005.png" title="Newsflash 5" >
| |
- | <div class="lof-main-item-desc">
| |
- | <h3><a target="_parent" title="Newsflash 5" href="#">/ Newsflash 5 /</a> <i> — Monday, February 15, 2010 12:42</i></h3>
| |
- | <h2>Content of Newsflash 5</h2>
| |
- | <p>Joomla! 1.5 - 'Experience the Freedom'!. It has never been easier to create your own dynamic Web...
| |
- | <a class="readmore" href="#">Read more </a>
| |
- | </p>
| |
- | </div>
| |
- | </li>
| |
- | <li>
| |
- |
| |
- | <img src="images/thumbl_980x340_006.png" title="Newsflash 5" >
| |
- | <div class="lof-main-item-desc">
| |
- | <h3><a target="_parent" title="Newsflash 6" href="#">/ Newsflash 6 /</a> <i> — Monday, February 15, 2010 12:42</i></h3>
| |
- | <h2>Content of Newsflash 6</h2>
| |
- | <p>Joomla! 1.5 - 'Experience the Freedom'!. It has never been easier to create your own dynamic Web...
| |
- | <a class="readmore" href="#">Read more </a>
| |
- | </p>
| |
- | </div>
| |
- | </li>
| |
- | <li>
| |
- | <img src="images/thumbl_980x340_007.png" title="Newsflash 5" >
| |
- | <div class="lof-main-item-desc">
| |
- | <h3><a target="_parent" title="Newsflash 7" href="#">/ Newsflash 7 /</a> <i> — Monday, February 15, 2010 12:42</i></h3>
| |
- | <h2>Content of Newsflash 7</h2>
| |
- | <p>Joomla! 1.5 - 'Experience the Freedom'!. It has never been easier to create your own dynamic Web...
| |
- | <a class="readmore" href="#">Read more </a>
| |
- | </p>
| |
- | </div>
| |
- | </li>
| |
- | <li>
| |
- | <img src="images/thumbl_980x340_008.png" title="Newsflash 8" >
| |
- | <div class="lof-main-item-desc">
| |
- | <h3><a target="_parent" title="Newsflash 8" href="#">/ Newsflash 8 /</a> <i> — Monday, February 15, 2010 12:42</i></h3>
| |
- | <h2>Content of Newsflash 8</h2>
| |
- | <p>Joomla! 1.5 - 'Experience the Freedom'!. It has never been easier to create your own dynamic Web...
| |
- | <a class="readmore" href="#">Read more </a>
| |
- | </p>
| |
- | </div>
| |
- | </li>
| |
- | </ul>
| |
- | </div>
| |
- | <div class="lof-navigator-wapper">
| |
- | <div class="lof-navigator-outer">
| |
- | <ul class="lof-navigator">
| |
- | <li><span>1</span></li>
| |
- | <li><span>2</span></li>
| |
- | <li><span>3</span></li>
| |
- | <li><span>4</span></li>
| |
- | <li><span>5</span></li>
| |
- | <li><span>6</span></li>
| |
- | <li><span>7</span></li>
| |
- | <li><span>8</span></li>
| |
- | </ul>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- |
| |
- |
| |
- | </html>
| |
| | | |
| == トップページ建設予定地 == | | == トップページ建設予定地 == |