多機能なフローティングパネルを実装できるjQueryプラグイン「jsPanel3」 – bl6.jp
jsPanel3は、高度で多機能なフローティングパネル（ウィンドウ）を実装することができるjQueryプラグインです。フルスクリーン、リサイズ、ドラッグ移動など、いろんな機能が搭載されています。 モーダルウィンドウ、通知、ツールバーなども実装できる 以下、jsPanel3の実際のデモページです。 デモ デモでは画面の下の方にフローティングパネルが表示されています。パネルの右上に表示されているいくつかのアイコンから、パネルを閉じたりフルスクリーンにしたり、またはリサイズしたりといったことが可能です。 また、パネルの上部にカーソルを合わせるとカーソルのアイコンが変化するので、その状態でドラッグするとパネルを好きな位置に移動することができます。ブラウザ上でこれだけ自由なフローティングパネルが実装できるのはうれしいですね。 パネルの中に表示されている「Next panel」をクリックすると、次のパ
フォントが大好物な人におすすめ！チェックしておきたい日本語の新作フリーフォントのまとめ
最近リリースされたひらがな・カタカナ・漢字が使える日本語の新作フリーフォントを紹介します。 昭和レトロなフォント、縦書きの本文に適したフォント、タイトルやコピーにぴったりなデザインフォントなど、たくさんのフォントがリリースされています。 最近のだけでなく、これまで全部の日本語の無料フォントは下記をどうぞ。 2019年用、日本語のフリーフォント 366種類のまとめ 最新のフリーフォント、まずはかわいいデザインの「ポプらむ☆キュート」から。 ポプらむ☆キュート 個人・商用サイトで無料利用可。同人誌や各種印刷物なども可。 かわいいの波及を追い求めて作成された「ポプらむ☆キュート」 通称ブリッコ文字・マンガ文字と呼ばれた昭和時代の女子校生に流行ったコミカルな変体のまる文字で、現代風のテイストを入れつつ、デジタル用にアレンジしてデザインされています。 ひらがな・カタカナ・英数記号文字だけでなく、JI
berryjack - Twitter画像をまとめてダウンロード
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Twitterはストリームなサービスなので、データがどんどん流れていってしまいます。そんな時、一時的に足を止めてデータを懐かしみたい時もあるはずです。しかしデータが流れてしまっていると探すのも大変です。 今回は写真にフォーカスしたダウンロードツール、berryjackを紹介します。 berryjack の使い方 berryjackはユーザ名を指定して実行するだけです。後は自動的に画像をダウンロードしてくれます。 $ ./berryjack moongift Try to download media without login. [bj] Target: moongift 2017-06-13 12:11:36 URL:https://pbs.twimg.com/media/B-0
スライドアップ・ダウンを設定された速度で制御できる「slideSpeed」 – bl6.jp
slideSpeedは、特定の要素のスライドアップ・スライドダウンを設定された速度で制御することができるjQueryプラグインです。高さのある要素なんかをスライドアップ・スライドダウンさせる時に、このくらいの時間をかけて実行させたいという場合に便利そうですね。 以下のページからslideSpeedの実際のデモ動作をチェックできます。 デモ デモでは「Click me」と書かれた赤いボタンをクリックすると、要素がスライドダウンで表示されます。2秒かかってスライドダウンする設定になっています。また、再度ボタンをクリックすると、今度はスライドアップで元の非表示の状態に戻ります。こちらも、同じく2秒かけてスライドアップされます。 使い方もシンプルでとても簡単に実装できるのがいいですね。オプションには、speed、slide、callbackが用意されています。オプションのデフォルト値は、speed
最近のデザインでよく見かける色相を変化させた美しいグラデーションがまとめられた無料素材 -coolHue | コリス
最近のWebサイトやスマホアプリのデザインで人気が高い、色相を変化させた美しいグラデーション素材を紹介します。 Photoshop, Sketchのグラデーション素材として、またコードベースで利用することもできます。
新しくホームページを作る時にチェックすべき20のこと
Web業界の統計情報を集める "Internet Live Stats" の調査によると、2014年9月に全世界のWebサイトの数は10億サイトを突破し、2017年6月時点では約12億900万件超となっています。 ※ここでいうWebサイトとは、識別可能なホスト名やIPアドレスを持っているという意味 1991年7月6日に、スイスで世界初のWebサイトが登場。それから、かなりの月日が経過しますが、2017年6月時点では1分間におよそ120ものサイトが生まれている計算になり、Webサイトを立ち上げることは"より一般的"なものになりつつあります。 昔に比べると、ドメイン取得の費用も安く、手続きも非常に簡単になり、サーバーの維持管理も牛丼1杯分ほどの月額費用で運用できるようになりました。 これは、情報の発信のしやすさという意味では非常に良いことですが、一方で世界中の人々がたくさんの情報を発信している
SmartPhoto.js - 横スライドする画像ビューワー MOONGIFT
画像とレスポンシブデザインの相性はあまりよくありません。最適なサイズで見せたいと思ってもパーセントで指定せざるを得ないですし、テキストのように自由に改行ができる訳でもありません。特に写真をメインにしたサイトでは悩みのタネでしょう。 そこで使ってみたいのがSmartPhoto.jsです。特にモバイルデバイスに最適化されたレスポンシブなイメージビューワーです。 SmartPhoto.jsの使い方 こちらはPCサイズの場合。 こちらはスマートフォン。写真のサイズはあまり変わっていません。 そして横スクロールで写真を切り替えられます。 SmartPhoto.jsは写真のサイズを変えずに横スクロール化することでスマートフォンなどの小さな画面でも見やすい状態を保っています。レスポンシブなデザインだとついPCと同じ情報を一つの画面サイズに押し込んでしまいがちですが、スクロールをうまく使えば解決できそうで
JavaScriptライブラリを大量にまとめた・「awesome-javascript」
awesome-javascriptは超大量のJavaScriptライブラリをまとめたGithubページです。特にフロントエンドサイドで動くライブラリを中心に集められているようです。データ可視化、ユーティリティ、ローダー、テンプレートエンジンなどさまざま。かなり多いのでゆっくり見ていこうかと思います。 awesome-javascript
スゴイ便利！Webページの構造を視覚化し、レスポンシブの表示サイズごとの変化を確認できるChromeの機能拡張
こんな便利な機能拡張があったんですね！ レスポンシブ対応ページを作成する時に大切なのは、さまざまな表示サイズでレイアウトや要素がどのように変化するかです。 レイアウトやコンポーネントの構造を視覚化し、px, emでサイズを表示し、その変化を確認できるChromeの機能拡張「Responder」を紹介します。 ResponderはWebページの表示サイズを変更すると、ページ上の要素をブロックレベルでアウトラインで表示し、どのように変化するかが確認できます。 Responderが表示されるのはブラウザのサイズを変更している間だけで、変化しない場合は表示されません。 サイズはpx単位とem単位に対応しており、幅と高さが表示されます。 インストールは、下記ページから。
WEB+DB PRESS Vol.99の「良いコード」を本気でコードレビューしてみた - give IT a try
はじめに Twitterを見てたら、気になる雑誌の特集を見つけました。 WEB+DB PRESS Vol.99の「Rubyで学ぶ！良いコードって何だろう？」という特集記事です。 WEB+DB PRESS Vol.99 作者: ?橋健一,谷口禎英,井本大登,山崎勝平,大和田純,内村元樹,坂東昌哉,平田敏之,牧大輔,板敷康洋,大?浩崇,穴井宏幸,原口宗悟,久田真寛,ふしはらかん,のざきひろふみ,うらがみ,ひげぽん,池田拓司,はまちや2,竹原,片田雄樹,渋江一晃,WEB+DB PRESS編集部編出版社/メーカー: 技術評論社発売日: 2017/06/24メディア: 大型本この商品を含むブログを見るRuby大好き！きれいなコード大好き！！な僕にとっては、この特集は読まずにはいられません！ 早速買って読んでみました。 お～、なるほど、たしかにいいことが書いてある！ うんうん、そうそう・・・あれ？この
市教委「今年から通知表を電子化します…が、お金はかけられないのでExcelです。」「あ、これ絶対しわ寄せが現場にくるタイプだ…」 - パパ教員の戯れ言日記
通知表の時期来たる 今年も1学期が終わろうとしています。そろそろ通知表の時期になってまいりました。 通知表といえば、法律には何も定まっていないのに何故か学校側が出している書類として、仕事負担の増加への寄与度が圧倒的に高いラスボス的な存在でございます。 40人学級だった時にはマジで死ぬかと思いました。今でも、1週間近くは朝3時起きで仕事しないと間に合わない。その時ばかりは娯楽を断ちます。 手書きの通知表は時間がかかる。 今の学校は手書きでやれという指示だったので、全部手書きです。 文章だけで、 総合的な学習の時間の所見 特別活動（係やクラブ、委員会）の所見 外国語活動の所見 総合所見 の4種類がありました。一人につき4種類です。それぞれは50文字程度から200文字程度ですが、一人につき原稿用紙2枚分ほどの分量を書くというのはなかなか骨が折れます。特に外国語活動。「AETの発音をよく聞き、大き
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
多機能なモーダルダイアログ実装Bootstrapライブラリ「ssi-modal」:phpspot開発日誌
next.jsを使ったMarkdownベースのブログシステム・「next-blog」
シンプルデザインのモーダル実装「PIGNOSE Popup」:phpspot開発日誌
iPhoneの栄光、終わりの始まり 発売10周年 - 日本経済新聞
PHPでシリアライズされたデータをブラウザ上で編集できる『Serialized Editor』 | 100SHIKI