初めての方へ
当サイトは、三河地方を中心に活動する、ノンジャンルサークルLEDを、紹介、提案、告知、などなどするサイトです。
2009年８月21日、都市部の名古屋にはあっても、そこから離れるとサークル活動がない、ないなら作ろう！と何人かの友人たちと作った、友達が友達を連れてくる、他愛もないサークルがLEDでした。
しかし、気づけば2015年現在、丸６年を迎えようとしており、ありがたいことに活動の頻度は増え、参加者も増え、果ては関東に支部ができるなど、ドンドンその輪は広がっています。
加えて、当初ノンジャンルと称していましたが、なかったものを埋める形で、酒飲みサークル、サブカルサークル、イベントサークルとしての側面を強め、三河地方で唯一無二の存在になってきたかなと、自称しております。
そんなわけで、更なる参加者増加と、LEDのようなサークルを求めている人がいるかもしれないという思いから、サイトを作りつつ、露出度を高めようとしているのがこのサイトの趣旨です。
少しでもLEDの興味を持ってもらって、ちょっとでも参加していただけたら、こんなに嬉しいことはありません。
完全幅固定タイプです。
全体的な横幅は960px、メインコンテンツ部分620px（余白除く）、サブコンテンツ部分300px（余白除く）です。サブコンテンツ部分はメニューやバナー等を配置することを想定し、幅を広く取りました。
インデックスページの画像のスライドショーについて
画像がスライドしながら自動で切り替わるように設定しています。切り替わる時間やスライドの時間などいろいろオプションが変更できます。サンプル画像は当方で撮影したものです。画像を差し替えてご利用ください。
使い方について
HTMLファイルのheadタグ内にて、
<script type="text/javascript">
$(function() {
$('#headImage').slideshow({
autoSlide : true,
effect : 'fade',
type : 'repeat',
interval : 3000,
duration : 1000,
imgHoverStop : true,
navHoverStop : true
});
});
</script>
というように記述します。また、いくつかオプションがあります。
| autoSlide | スライドショーを自動にするかどうかを選べます。「true」で自動、「false」で自動では動かないようにできます。 初期値は「true」です。 |
|---|---|
| effect | スライドする効果の種類です。「'fade'」でフェードイン、「'slide'」で横スライドします。 初期値は「'fade'」です。 |
type | スライドショーのタイプを選べます。「'repeat'」はカルーセルタイプで画像が最後まで表示されると最初に戻り、ループします。「'stop'」は最後の画像が表示されるとそこでストップします。 autoSlideの値がtrueで、typeの値がstopの場合、最後の画像が表示されない限りは常にautoSlideが有効になっています。最後の画像が表示されると、戻る方向に画像を表示しても、autoSlideが無効になります。 初期値は「'repeat'」です。 |
| interval | 次のスライドまでの止まっている時間です。単位はミリ秒ですが、単位まで記述する必要はありません。 初期値は「3000」です。 |
| duration | スライドするスピードです。単位はミリ秒ですが、単位まで記述する必要はありません。 初期値は「1000」です。 |
| imgHoverStop | 画像にホバーした際、スライドをストップするかを選べます。「true」でスライドをストップ、「false」でスライドをストップしないようにできます。 初期値は「true」です。 |
| navHoverStop | 画像下のページネーションにホバーした際、スライドをストップするかを選べます。「true」でスライドをストップ、「false」でスライドをストップしないようにできます。 初期値は「true」です。 |
ページトップへの戻りリンクについて
ページトップへの戻りリンクは、ページの右下に配置しており、スクロールすると現れる仕組みになっています。こうすることにより、ページトップへの戻りリンクが目に入りやすく、ユーザにこのリンクを、より活用していただけるのではないかと思います。
JavaScript(jQuery）の使用について
当CSSデザインテンプレートでは、JavaScript(jQueryライブラリ）を使用しています。使用している箇所は、インデックスページのスライドショー、インデックスページのスライドショー下の3つコンテンツが並んでいるエリア、ページトップへの戻りリンクです。そのため、JavaScriptを有効にしていないブラウザではレイアウト崩れを起こしてしまいますので、ご留意ください。
カスタマイズについて
カスタマイズはご自由になさってください。
制限はありません。
その他、不具合などございましたら
CoolWebWindowにお知らせください。
サンプルタグについて
以下、サンプルタグになります。ご利用の際は参考にしてみてください。
h2タグ
h3タグ
h4タグ
h5タグ
h6タグ
強調（em）
より強い強調（strong）
追加（ins）
削除（del）
テキストアンカー
リスト
普通のリスト
- 普通のリスト1
- 普通のリスト2
- 普通のリスト3
番号付きリスト
- 番号付きリスト1
- 番号付きリスト2
- 番号付きリスト3
li要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。
定義リスト
- 定義リスト1
- 定義した用語の説明
- 定義リスト2
- 定義した用語の説明
- 定義リスト3
- 定義した用語の説明
dd要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。しかし、dt要素にはインライン要素しか記述することができません。
テーブル
| 見出し1 | 見出し2 | 見出し3 | 見出し4 | 見出し5 |
|---|---|---|---|---|
| セル1 | セル2 | セル3 | セル4 | セル5 |
| セル1 | セル2 | セル3 | セル4 | セル5 |
| セル1 | セル2 | セル3 | セル4 | セル5 |
