熊本龍田本舗熊本龍田本舗

Menu

通常表示の例です。

和菓子名200円

商品名

あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

class="transform1"の例です。

和菓子名200円

商品名

あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

class="transform2"の例です。

和菓子名200円

商品名

あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

class="up"の例です。

和菓子名200円

商品名

あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

class="left"の例です。

和菓子名200円

商品名

あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

class="right"の例です。

和菓子名200円

商品名

あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

divタグでなく、中の画像だけに指定してもOKです。

200円

商品名

あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。あまり詰め込みすぎると途中で切れるので注意して下さい。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

和菓子名200円

商品名

ここに説明を入れます。サンプルテキスト。サンプルテキスト。サンプルテキスト。

オリジナルのアニメーションを作りたい場合は

cssフォルダのinview.cssに、cssで動くアニメーションタグを追加します。
css冒頭の「共通設定」の2箇所にも追加するのを忘れないようご注意下さい。

スタイルを追加したら、jsフォルダのjquery.invie_set.jsにタグを追加して下さい。
既存のタグをコピペして、スタイル名を2箇所入れ替えればOKです。

transformのアニメーションが動作しない場合

htmlの下部に、
<!--パララックス用ファイル読み込み-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/protonet-jquery.inview/1.1.2/jquery.inview.min.js"></script>
<script src="js/jquery.inview_set.js"></script>

のタグがあるか確認して下さい。

httpsから始まるurlは将来リンク切れを起こす可能性もあります。その際は改めて「jQuery CDN」などでネット検索し、新しいurlに置き換えて下さい。