[B! jQuery] takeshiのブックマーク

MagicNav

Basic Usage Easily generate links from elements on your page. For example, generate links to all the articles on a page by linking to the article’s h1’s, and put them in a nav element on the page with an id of article-nav. (By default, the links will use the same text as the h1). $.MagicNav($('#article-nav'),$('article h1')); The first argument to $.MagicNav is a selector for the element to which

takeshi 2012/09/07

リンク

[JS]ノート風のレイアウトもOK！画像をベースラインに揃えて配置するだけのシンプルなスクリプト -Baseline.js

Baseline.js適用後 Baseline.jsの使い方使い方は2ステップです。 Step 1: 外部ファイル「jquery.js」と当スクリプトを外部ファイルとして記述します。 <script src="http://code.jquery.com/jquery.min.js"></script> <script src="js/jquery.baseline.js"></script> Step 2: JavaScript 適用する範囲をjQeuryのセレクタで指定し、ペースラインをpxで指定します。 $('img').baseline(24); //全てのimg要素に24pxのベースライン $('.content img').baseline(30); //.content内のimg要素に30pxのベースラインレスポンシブデザインにも対応しており、ブレイクポイントごとにベー

takeshi 2012/06/25

リンク

Redactor WYSIWYG html editor

A simple and fast tool for everyday tasks of creating and editing texts on the web. Suitable for creating and editing common texts for the web, which may also include images, video, embed code. It has a hybrid interface that can be customized according to your needs. For example, you can disable the main toolbar and only show the context toolbar when highlighting text. Or show the control toolbar

takeshi 2012/05/29

リンク

jQueryでマウスホイールで横にスクロールする横型コンテンツ

Posted: 2011.07.21 / Category: javascript / Tag: jQuery, アニメーション通常のWebサイトは縦長でマウスホイールで下に移動していきますが、最近よく見かけるようになった横長タイプのコンテンツをjQueryを使用して作成する方法をご紹介します。機能としてはマウスホイールで横に移動と、ナビゲーションボタンをクリックで指定位置までスライドするということをやってみます。 html+css htmlはナビゲーションであるリストとコンテンツを入れるためのdivが５つあります。 html <div id="contents"> <ul id="nav"> <li><a href="#s01">01</a></li> <li><a href="#s02">02</a></li> <li><a href="#s03">03</a></li> <li>

takeshi 2012/02/07

リンク

jQueryで長くなったページを分割してボタンで切り替える

Posted: 2011.05.25 / Category: javascript / Tag: jQuery 長いページの場合、アンカー名をつけてページ内リンクをする場合があると思います。でも、やっぱりページ別けしたいかな、でも同じ内容だし別けちゃうのもな、、、そんなときのためにjQueryを使用してわりとそのままのマークアップでページを分割してボタンで切り替える方法をご紹介します。ページ内リンクしたマークアップでページ分割する「section」ごとにページを分割します。それぞれにidを割り振り、そのidに飛ぶように「nav」にはリンクを付けます。普通のページ内リンクですね。 html <ul class="nav"> <li><a href="#c1">1</a></li> <li><a href="#c2">2</a></li> <li><a href="#c3">3</a

takeshi 2012/02/06

jQuery

リンク

jQueryでiframe内のページから親ページを操作する方法｜BLACKFLAG

少し前に「jQueryでiframeの親ページからインラインフレーム内の子ページを操作する方法」と題して、 iframeの親ページから子ページを操作する方法を紹介しましたが、その逆の、iframeの子ページから親ページを操作をする方法について簡単なサンプルを交えて紹介してみます。親ページ側では特にjQueryファイル自体を読み込む必要は無く、 iframe内に表示するページ側で、jQueryファイルと共に下記の様なスクリプトを書くことで操作することが可能になります。 ◆SCRIPT $(function(){ $('p',parent.document).css({color:'#ff0000'}); }); この記述方法（参考例）の場合だと、iframe内のページからの操作で親ページの＜p＞タグのテキスト色を「赤」に変更します。スクリプトを実行させる該当要素の後に「,pare