はてブログ

はてなブックマーク新着エントリーの過去ログサイトです。



タグ ドロップダウン

新着順 人気順 5 users 10 users 50 users 100 users 500 users 1000 users
 
(1 - 25 / 44件)

ジャストシステム、ノーコードクラウドDB「JUST.DB」リリース

2022/08/01 このエントリーをはてなブックマークに追加 22 users Instapaper Pocket Tweet Facebook Share Evernote Clip ジャストシステム ワークフロー プログラミング 数値 リリース

ジャストシステムは8月1日、プログラミングの知識不要で業務システムを構築できるノーコードクラウドデータベース「JUST.DB」を10月1日から提供すると発表した。案件管理や資産管理、ワークフローなどのシステムを構築できる。 「文字列」「数値」「ドロップダウン」といった部品アイコンをドラッグ&ドロップするだけで... 続きを読む

JSを一切使わないCSSでできたドロップダウンなどのUI実装「CSSUI」:phpspot開発日誌

2022/02/23 このエントリーをはてなブックマークに追加 12 users Instapaper Pocket Tweet Facebook Share Evernote Clip CSS phpspot開発日誌 UI実装

CSSUI - Pure CSS interactive components JSを一切使わないCSSでできたドロップダウンなどのUI実装「CSSUI」 そこまでJSを使わない必要があるのか、と逆に思ってしまいますが、リッチなUIがCSSのみで作れてしまいます 続きを読む

WebサイトのUIにさまざまなフローティング要素を実装するためのJavaScriptのライブラリ -Floating UI

2021/12/06 このエントリーをはてなブックマークに追加 19 users Instapaper Pocket Tweet Facebook Share Evernote Clip ライブラリ ナビゲーション 衝突 Floating UI 実装

WebサイトのUIにフローティング要素、ドロップダウン、ツールチップ、ポップオーバー、ナビゲーションなどを実装するJavaScriptのライブラリを紹介します。 フローティング要素の実装で問題となる配置の向きや衝突やオーバーフローなどにも対応しており、アクセシブルなフローティング要素を実装できます。 Floating UI ... 続きを読む

Vue.jsベースのオープンソースなUIコンポーネントライブラリ・「Element」 | かちびと.net

2018/09/13 このエントリーをはてなブックマークに追加 20 users Instapaper Pocket Tweet Facebook Share Evernote Clip Element タイポグラフィ OSS レーティング アラート

Element ElementはVue.jsをベースとしたOSSのUIコンポーネントライブラリです。フォームやレイアウト、ボタンやタイポグラフィはもちろん、タイムピッカーやスライダー、レーティングなど、より応用の効くフォームのアイテムやアラート、ダイアログ、ドロップダウンやツールチップ等、よく使われるUIなど、多くのシーン... 続きを読む

Vue.jsでドロップダウンを作り込む - SCOUTER開発者ブログ

2017/12/08 このエントリーをはてなブックマークに追加 35 users Instapaper Pocket Tweet Facebook Share Evernote Clip Vue.js SCOUTER開発者ブログ コンポーネント

2017 - 12 - 08 Vue.jsでドロップダウンを作り込む Vue.js Element Tweet こちらは Vue.js #4 Advent Calendar 2017 - Qiita 8日目の記事です。 株式会社SCOUTERの鍬( id:yusuke_kuwa ) です。 今回は、Vue.jsらしい美しいコードだなと思ったドロップダウンの コンポーネント 作成に焦点を当てて、作っ... 続きを読む

Web制作者が揃えておきたい、macOSのデスクトップ用のGUIが揃った無料のデザイン素材 | コリス

2017/08/21 このエントリーをはてなブックマークに追加 34 users Instapaper Pocket Tweet Facebook Share Evernote Clip インターフェイス コリス カーソル Safari MacOS

ユーザーフローを構築する場合でも、Macのインターフェイスを構築する場合でも、現在利用できるデスクトップのGUI素材はほとんど見かけません。 macOSのインターフェイス、Safari, Chromeなどのブラウザに含まれるUI要素をはじめ、メニューバーやドロップダウン、カーソルまで、デスクトップ用のGUIが揃った無料のデザイン素材を紹介します。 Desktop Kit -Facebook Des... 続きを読む

Slack、メッセージにドロップダウンの新メニュー--複雑なワークフローに対応 - CNET Japan

2017/04/12 このエントリーをはてなブックマークに追加 13 users Instapaper Pocket Tweet Facebook Share Evernote Clip Slack ワークフロー Slack内 インタラクティブ性

Slack Technologiesは、同社が手がける職場用コラボレーションプラットフォーム「Slack」でやり取りされるメッセージのインタラクティブ性を強化する目的で、新たなメニューを追加した。この メッセージメニュー により、ユーザーはクリック可能なドロップダウンメニューを使って、より複雑なワークフローをSlack内で完了できる。 今や1日あたり500万人のアクティブユーザー、150万人の有料... 続きを読む

ナビメニュー100連発!CSSで表現できるコピペ可能なHTMLスニペットまとめ - PhotoshopVIP

2017/01/05 このエントリーをはてなブックマークに追加 158 users Instapaper Pocket Tweet Facebook Share Evernote Clip CSS コピペ ナビゲーションメニュー HTML モバイル端末

ウェブサイトにおいてユーザーが特に操作する機会の多い部分のひとつが、ナビゲーションメニューでしょう。モバイル端末でのアクセスが増えているいま、より使いやすいスタイルが求められるようになっています。 今回は HTML と CSS、わずかな JavaScript で実装できるさまざまな ナビゲーションメニュー用コードスニペット をまとめてご紹介します。アコーディオン型やサークル型、ドロップダウンやフル... 続きを読む

【修正済み】記事編集画面(PC版)の一部機能が利用できない不具合がありました - はてなブログ開発ブログ

2016/02/05 このエントリーをはてなブックマークに追加 14 users Instapaper Pocket Tweet Facebook Share Evernote Clip 修正済み PC版 記事編集画面 一部機能 見出し

2016 - 02 - 05 【修正済み】記事編集画面(PC版)の一部機能が利用できない不具合がありました 障害・メンテナンス 2016年2月4日(木)16:33から2016年2月5日(金)11:58ごろまで、PC版の記事編集画面にて下記の不具合が発生していました。 編集 ツールバー の「見出し」「文字サイズ」のドロップダウンがうまく動作しない 文字数カウントが表示されない 原因はアプリケーション... 続きを読む

[jQuery] レスポンシブWebデザイン対応のメガメニュー - かちびと.net

2016/02/02 このエントリーをはてなブックマークに追加 25 users Instapaper Pocket Tweet Facebook Share Evernote Clip jQuery ウインドウサイズ アコーディオン ウィ net

Result See the Pen megamenu.js – Last responsive megamenu you’ll ever need by Mario Loncarek ( @riogrande ) on CodePen . ウィンドウサイズが943px以上はドロップダウン、以下の時はクリックで開閉するアコーディオンのメガメニュー。上記デモはモバイル向けになっていると思います。ウィ... 続きを読む

ドロップダウン実装を簡単にサポートしてくれるDorp.js*ホームページを作る人のネタ帳

2015/09/10 このエントリーをはてなブックマークに追加 68 users Instapaper Pocket Tweet Facebook Share Evernote Clip ネタ帳 実装 ドキュメントファイル ソース ホームページ

ドロップダウン実装を簡単にサポートしてくれるDorp.js 2015/09/10 ツイート スポンサーリンク 手軽にドロップダウンの実装をサポートしてくれるjsのご紹介。 サンプルページのソースを見ればほとんどわかりますが、ドキュメントファイルは一度目を通しておくといいかもしれません。 ドロップダウンに関する動作 サイズバーもお手軽実装。 各種動作設定も可能。 一番上のシェアボタンはクリックしてメ... 続きを読む

CSSだけで作る「多階層」なドロップダウンメニュー|Webpark

2013/10/15 このエントリーをはてなブックマークに追加 144 users Instapaper Pocket Tweet Facebook Share Evernote Clip Webpark 矢印 階層 CSS 擬似要素

以前書いた「CSSだけで作る動きのあるドロップダウンメニュー|Webpark」という記事が検索エンジン経由でそこそこアクセスがあり、よく質問をいただきます。そのなかで多階層にできないのかという質問があったので作ってみました。 IE7の場合擬似要素が使えませんので、次の階層があることを示す矢印が表示されません。ドロップダウンの機能はIE7でも問題ありませんので、IE7に対応させる場合は矢印を画像にす... 続きを読む

ウェブデザイン用の各エレメントをフラット・ソリッドなど複数のスタイルに展開させたPSD素材 -3in1 UI Elements | コリス

2013/10/10 このエントリーをはてなブックマークに追加 67 users Instapaper Pocket Tweet Facebook Share Evernote Clip コリス elements ソリッド PSD素材 UIエレメント

ナビゲーション、パンくず、ドロップダウン、ボタンなど、UIエレメントのデザインをそれぞれフラットとソリッドと立体感のあるバルキーの3パターンに展開させたPSD素材を紹介します。 フラットが好き、ソリッドが好きでそのまま使うもよし、比較して勉強するのにもよし、のちょっといつもとは趣向の違った素材となっています。 3 in 1 User Interface Elements Kit Part 1 (F... 続きを読む

Google、フラットな新ロゴとドロップダウンのナビゲーションをローンチ中―黒いメニュー・バーは引退へ | TechCrunch Japan

2013/09/19 このエントリーをはてなブックマークに追加 15 users Instapaper Pocket Tweet Facebook Share Evernote Clip ナビゲーション 引退 TechCrunch JAPAN 期日

Googleは新しいロゴと新しいナビゲーション・メニューを発表した。これにともなって黒いナビゲーション・バーは引退する。今朝(米国時間9/19)、われわれはGoogleがアプリ・ランチャー方式のナビゲーション・メニューを数週間以内に導入すると書いたが、実際にはローンチの期日はもっとずっと早かった。 Googleの公式発表はこちら。 これにともなってGoogleのサービスの画面トップに表示されていた... 続きを読む

[JS]不可視のDOMをコントロールしてUIを拡張するスクリプト -Shadow UI | コリス

2013/09/16 このエントリーをはてなブックマークに追加 45 users Instapaper Pocket Tweet Facebook Share Evernote Clip コリス DOM extensions スクリプト jQuery

ドロップダウン、モーダルウインドウ、ポップアップ、ツールチップなど、最初は可視状態にないDOMをコントロールしてUIを拡張するjQueryのプラグインを紹介します。 「Shadow DOM besed UI extensions」って表現するセンス、いいですね。 Shadow UI Shadow UI -GitHub Shadow UIのデモ Shadow UIの使い方 Shadow UIのデモ ... 続きを読む

ドロップダウンをフラットでクールにするjQueryプラグイン「EasyDropDown」:phpspot開発日誌

2013/09/03 このエントリーをはてなブックマークに追加 35 users Instapaper Pocket Tweet Facebook Share Evernote Clip jQueryプラグイン phpspot開発日誌

ドロップダウンをフラットでクールにするjQueryプラグイン「EasyDropDown」 2013年09月03日- EasyDropDown - A Drop-down Builder for Styleable Inputs and Menus ドロップダウンをフラットでクールにするjQueryプラグイン「EasyDropDown」 次のようなクールなドロップダウンを実装することが出来ます。CS... 続きを読む

[CSS]アニメーションで細かい動きを加えたカード状のドロップダウンのデモがかなりかっこいい | コリス

2013/07/23 このエントリーをはてなブックマークに追加 96 users Instapaper Pocket Tweet Facebook Share Evernote Clip コリス ポパー CSS アニメーションgif アニメーション

上記はデモをアニメーションgifにしたもので、初期はアイテムがカード状に重なっており、クリックすると中身がするすると表示されます。 最初にぱかっと開くの面白いですね、各アイテムはホバーでハイライトもします。 実際の動きは、下記ページでご覧ください。 CSS3 Card Deck Drop Down HTML 各アイテムはリスト要素でシンプルな実装です。 <div class="card-drop"... 続きを読む

Facebook、 近況アップデートに「今何してる?」をワンクリックで投稿できるエモーティコンを導入中 | TechCrunch Japan

2013/04/10 このエントリーをはてなブックマークに追加 23 users Instapaper Pocket Tweet Facebook Share Evernote Clip Facebook ワンクリック ムード アイコン 批判

これで自分の感情を表現するのがもっと簡単になるかもしれない。現実の複雑な状況や感情を単純化しすぎるものだという批判も出るだろう。今日(米国時間4/9)、Facebookは自分が現在やっていることやムードをアイコン(エモーティコン)で表現するオプションを近況アップデート窓に追加した。ドロップダウン・メニューからさまざまなエモーティコンが選択できる。 Facebookがこのオプションをテストし始めたの... 続きを読む

レスポンシブなCSSベースのドロップダウンメニュー「Top Drawer」:phpspot開発日誌

2013/02/06 このエントリーをはてなブックマークに追加 22 users Instapaper Pocket Tweet Facebook Share Evernote Clip CSSベース phpspot開発日誌 Experiment

Top Drawer - A smooth dropdown menu for responsive web design | Experiment #5 レスポンシブなCSSベースのドロップダウンメニュー「Top Drawer」 JavaScriptを使わずCSS transformsを使ってレスポンシブなドロップダウンをアニメーションさせつつ表示できます。 シンプルなサイトな作りにしたい場合は... 続きを読む

よく使う設定メニューをひとつの画面にまとめてくれるAndroid用アプリ『Hive Settings』 : ライフハッカー[日本版]

2013/01/19 このエントリーをはてなブックマークに追加 15 users Instapaper Pocket Tweet Facebook Share Evernote Clip ライフハッカー 画面 Android用アプリ 設定メニュー

Android , Google , ソフトウェア , デスクトップツール , メンテナンス , 最新テック よく使う設定メニューをひとつの画面にまとめてくれるAndroid用アプリ『Hive Settings』 2013.01.19 15:00 Android:ほとんどのAndroidデバイスには通知用のドロップダウンにウィジェットやツールバーがすでに搭載されていて、Wi-FiやBluetoot... 続きを読む

[WordPress] タグクラウドをドロップダウン&タグの使用件数を表示 | ラクイシロク

2013/01/06 このエントリーをはてなブックマークに追加 31 users Instapaper Pocket Tweet Facebook Share Evernote Clip ラクイシロク PHP ウィジェット WordPress コード

WordPress のウィジェットでは、タグをドロップダウン形式にすることはできません。そこでアーカイブやカテゴリーと同じように、タグをドロップダウン表示してみます。 タグクラウドをドロップダウン&タグの使用件数を表示 sidebar.php などの任意の場所に、以下のコードを記述します。 <?php $tags = get_tags(); if ( $tags ) : ?> <select on... 続きを読む

[CSS]スクリプトに依存せずに、「:checked」でできるテクニックをBootstrapに組み込むプラグイン -Bootleg.css | コリス

2012/12/10 このエントリーをはてなブックマークに追加 87 users Instapaper Pocket Tweet Facebook Share Evernote Clip コリス checked Bootstrap カルーセル CSS

タブ、ドロップダウン、アコーディオン、カルーセルなど、今まではスクリプトに依存しないと実装できなかったものをスタイルシートベースで実装するBootstrapのプラグインを紹介します。 Bootstapのプラグインですが、CSSの「:checked」を使ったテクニックを学ぶのにも役立ちます。 Bootleg.css 仕組みは簡単に説明すると、見えない状態のラジオボタンを使い、そのオン・オフのチェック... 続きを読む

これは楽しい!巻き簾のようにくるっとはらりとなるCSS 3Dのドロップダウン | コリス

2012/10/24 このエントリーをはてなブックマークに追加 31 users Instapaper Pocket Tweet Facebook Share Evernote Clip コリス はらり

デモは、Firefox, Chromeの最新版でご覧ください。 「TOGGLE」ボタンをクリックすると、くるっとなります。 デモページ MakisuはjQueryのプラグインとして配布されています。 Makisu -GitHub オプションでは各アイテムのセレクタやアニメーションのスピードがちゃんと設定できます。 $( '.list' ).makisu({ selector: 'li', over... 続きを読む

Googleの、あの「黒い帯」を自由に並べ替えるChrome拡張:Big G Black Bar Sorter | Lifehacking.jp

2012/06/29 このエントリーをはてなブックマークに追加 21 users Instapaper Pocket Tweet Facebook Share Evernote Clip Chrome拡張 Lifehacking.jp Gmail

Googleサービスもずいぶん増えてきましたので、Gmailなどにアクセスした際に見られる上部のあの「黒い帯」では全てが表示できなくなりました。実際、一部は「その他」のドロップダウンメニューの中に隠れています。 しかし解せないのは、最も利用するサービスが表示されているわけでも、マイナーなものがドロップダウンに隠れているわけでもなく、Gmail のようなサービスでもドロップダウンに入ってしまっていて... 続きを読む

スマホ用サイトに使えそうなドロップダウン実装jQueryプラグイン「DropKick」:phpspot開発日誌

2012/06/13 このエントリーをはてなブックマークに追加 47 users Instapaper Pocket Tweet Facebook Share Evernote Clip DropKick default phpspot開発日誌

DropKick - a jQuery plugin for beautiful dropdowns スマホ用サイトに使えそうなドロップダウン実装jQueryプラグイン「DropKick」。 次のような白と黒のデザインでドロップダウンを実装できます。単なるselectボタンを $('.default').dropkick(); な感じで初期化してあげるだけで簡単。 黒のピカピカした感じもいいですが... 続きを読む

 
(1 - 25 / 44件)