今日の人気記事

  1. 国際電話の入力フォーム「International Telephone Input」

テキストを円や円弧状に「CircleType」

当ページのリンクには広告が含まれています。

スポンサーリンク

テキストを円や円弧状にしてくれるプラグイン「CircleType」を紹介します。

jQueryプラグイン「CircleType」

このプラグインを使えば、指定した要素のテキストを円や円弧状にしてくれいます。

テキストがやんわりカーブしているとサイトがやわらかく・ふんわりと印象になるんですね。おもしろいプラグインです。

円弧の角度や方向も指定することができるので、おすすめプラグインです。

スポンサーリンク

それではデモページをご覧ください。

「CircleType」のデモ

デモのソース(HTML + jQuery)

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="CircleTypeのデモでーす。">
<title>CircleType - jQueryプラグイン</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
</head>
<body>
<div class="container">
<h1 id="demo1">CircleType.js のデモでーす。</h1>
<p id="demo2">このように円や円弧のテキスト効果が楽しむことができます。</p>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/circletype.js"></script>
<script>
  $('#demo1').circleType({radius: 300, dir:-1});
  $('#demo2').circleType();
</script>

</body>
</html>
スポンサーリンク

関連記事(一部広告含む)