jQuery Tocible - jQuery製の自動生成型目次ライブラリ
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Webページで長いコンテンツを書いた場合、あらかじめ目次が用意されます。しかし多くの目次は文頭にあり、途中から選ぶことはできません。また、見出しレベルを細かくすると目次だけで長くなってしまって可読性が落ちてしまいます。 そこで使ってみたいのがjQuery Tocibleです。ヘッダーを使って自動生成し、使いやすい目次を提供します。 jQuery Tocibleの使い方 コンテンツの右側に自動生成された目次が表示されます。 スクロールすると小見出しが表示されます。 さらにスクロール。 実際に使っているところです。ハイライトされる部分がスクロールに合わせて変化しているのが分かります。 jQuery Tocibleは自動生成された目次で、かつフローティング表示なのでコンテンツを読みつつ、
jQuery Notebook - 見ているWebページをそのままに編集 MOONGIFT
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました まさにWYSIWYG！ 一般的にCMSを構築した場合、訪問者の見る画面と管理者の画面は分かれています。管理上、その方が分かりやすいのですが、管理者にとっては編集した内容がどのように表示されるかが掴みづらいのが難点です。 そこで最近では訪問者の見たままにWebサイトを編集できるCMSが増えていますが、同じような機能を独自のシステムにも追加できるのがjQuery Notebookです。 jQuery Notebookの使い方 jQueryプラグインだけあって使い方は簡単です。 <div class="my-editor"></div> $(document).ready(function(){ $('.my-editor').notebook(); }); これで完了です。続いてデモを
jQuery.dotdotdot·溢れるテキストの末尾処理はこれで！ MOONGIFT
システムでHTMLを出力する場合に良くあるのが想定よりも文字数が多くて溢れてしまうケースです。スタイルシートのオーバーフローで切り捨ててしまっても良いですが、突然文字が切れてしまうのは何となく違和感があります。 そこで用いるのが一定の文字数以上の場合、…で締めるというものですが、文字数と切れる場所が常にちょうど良いとは限りません（特に日本語、英語が混ざった場合）。そこで使ってみたいのがjQuery.dotdotdotです。 jQuery.dotdotdotは指定した行数で文字数を区切ってくれます。同様のライブラリとしてはtrunk8が知られています。 左側が溢れた場合。右側はjQuery.dotdotdotによる補正後です。 …だけでなく、Read moreのように文字を指定することもできます。 HTMLにも対応しており、マークアップが適切に反映されています。単純にちょん切る訳ではありませ
Qiitaのtextarea自動補完がOSSになりました - Qiita
jQuery.textcomplete（デモ） GitHubのようなtextareaの補完機能を実装する - カーソル位置の取得 を書いたのも今は昔、いつか続きを書こう書こうと思いながら気がつけば5ヶ月が過ぎました なんか続きを書くのが面倒くさくなったのと、某日本最大レシピ共有サイトの技術部長の人から「OSSにして欲しい」という要請を人伝に受け取ったこともあって、OSS化した次第です。 ライセンス MITライセンス 簡単な使い方 簡単に説明します。詳しくは README を読んでください。 まず jQuery.textcomplete は名前からも分かるように jQuery プラグインになっているので、別途 jQuery が必要です。 <script src="path/to/jquery.js"></script> <script src="path/to/jquery.textcomp
About - CLEditor
CLEditor is an open source jQuery plug-in which provides a lightweight, full featured, cross browser, extensible, WYSIWYG HTML editor that can be easily added into any web site. Live Demo Go ahead, take it for a test drive. Highlight some text and click some buttons. The following demos are a great source for code samples and examples of how to use plug-ins.
jQueryによる画像に沿ったテキスト回り込みライブラリ·jQSlickWrap MOONGIFT
jQSlickWrapはjQueryベース、JavaScript製のオープンソース・ソフトウェア。Webページの中に画像を差し込んで表示することは多々ある。そんなとき、画像が四角であれば回り込みも綺麗に行われるので申し分ない。だが三角の画像や、人物だけの画像の時に四角く回り込んでいるのはあまり格好が良くないだろう。 画像をスムーズに回り込んでいる イラストやシンボルに限定されるかも知れないが、背景が透明のPNG画像を使えば画像の形に合わせた回り込みができるのがjQSlickWrapだ。jQueryベースのソフトウェアで、背景を柔軟に処理して表示が出来るようになっている。 幾つかのサンプルがあるが、画像の枠線に合わせて透明な背景を無視して回り込みをしてくれる。Web上でこのような表現をするのは困難だったので、まるで雑誌のような仕上がりになるはずだ。さらに透明な背景を指定した色に変更することも
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
