git/index.lockを解除し無事にadd/commitできました。 | ハイパー猫背
なんかよく分からないが怒られた。 .git/index.lockとは エラーの文言的には，index.lockってファイルが存在しているからエラーになってるっぽい。 なんや，index.lockって。。 git/index.lockとは 同じgitのリポジトリ内で同時に複数の処理を行わないための排他制御を行うもの。 つまり，index.lockが存在するということは，裏で他のgit操作が行われている。 ならば，他のgit操作が終了するのを待てばいい。 もちろん，時間をおけばgit操作できるようになるのだが，「そんなの待ちきれないよ」って方は別の解決法で。 git/index.lockを削除 index.lockを削除してしまっても構わない。
【コピペOK】jQueryのアコーディオンメニュー実装サンプル10選！
どうも、ジャングルオーシャンのミケです。 今日はjQueryで実装するアコーディオンメニューのご紹介だよ。 簡単すぎてあっという間に実装できてしまうので 「HTMLとCSSはわかるけどjQueryってなんだかとっつきにくいな～」「jQueryってなに？JavaScriptのらいぶらり？は？」 と思ってるそこのあなた！ぜひ見ていってね！ ではいってみよう！ アコーディオンメニューとは アコーディオンメニューってなんだよって人の為に説明するね。 クリックやタップをするとうにょ〜んと中身が出てきて もう一度クリックやタップをするとしゅ〜んと中身が閉じていく機能のことだよ。 Webサイトでよく見かけるアニメーションだよね。 要素が多くてごちゃごちゃしがちなデザインを収納するのによく使われるよね。 アコーディオンメニューのメリット・デメリットはこちらの記事を参考にしてみてね。 具体的なイメージは用意
【jQuery入門】offset()で要素の位置を取得・設定する方法！ | 侍エンジニア塾ブログ | プログラミング入門者向け学習情報サイト
こんにちは、ライターのマサトです！ 今回は、jQueryで対象要素の位置座標を取得することができる「offset()」メソッドについて学習をしていきいましょう！ この記事では、 「offset()」とは？ offset()の使い方 「offset()」「position()」の違い スクロール量をoffset()で取得する方法 offset()の注意点 「offset()」とは？ それでは、まず最初に「offset()」メソッドについて基本的な知識から学習していきましょう！ 「offset()」は、画面上（document内）に配置したHTML要素の表示位置を座標で取得できるメソッドになります。 次のような位置座標をイメージすると分かりやすいでしょう！ このように「offset()」では、対象となるHTML要素の左上を原点としたX・Y座標を取得することができます。 これにより、jQuery
要素の表示位置を取得／設定するには？（offset）
offsetメソッドを使って、要素の「ドキュメント上の相対位置」を取得／設定する基本的な方法を説明する。 ← 前回 連載 INDEX 次回 → 要素のドキュメント上の表示位置を取得／設定するには、offsetメソッドを利用します（ただし、不可視の要素に対しては動作しません）。なお、類似のメソッドにpositionメソッドがありますが、これは現在の要素の親要素からの相対位置を取得するためのもので、機能が異なります（次回のTIPSで詳しく説明します）。 要素の表示位置を取得する まずは、位置情報を取得する方法からです。以下は、指定された要素（＝<div id="child">要素）の位置情報を表示するサンプルです。
JavaScript：連続クリック対応方法 - 覚え書き.com
画面上に設置したボタンを連続でクリックされた場合に予期しない挙動を引き起こす事が良くあります。 そういう場合の対応方法についてメモしておきます。 基本的に対応する方法としては以下の様な方法があります。 ボタンのdisabled属性をtrueにする フラグを設置してクリックされたらフラグをfalseに設定してイベント処理されないようにバイパスする 以下はjQueryベースで連続クリックされた場合にフラグを使用して判定する方法です。 jQueryサンプル // 連続クリック防止フラグ var clickFlg = true; jQuery(function($) { $(".button").on("click", function() { if(clickFlg) { // イベント処理中はフラグをoffにします。 clickFlg = false; // クリック処理を実施 } else
『クリックしたらツールチップを表示するスクリプト』をちょっと変えてみた。 - Qiita
js苦手なデザイナーの筆者としては、なるべくならコピペして事なきを得たい…と考えている。 が、仕事をしている以上、コピペしてちょっと手を加えて…という事は避けて通れない。特に、今回は再開発案件だったので、仕様を大きく変更することが難しい。 そこを前提として、下記の要件で絞ってみた。 jsに弱いデザイナーが考えた要件 ツールチップちっくだけど、マウスオーバーではなくクリックして表示させる 再開発前のツールチップは、『閉じる』のボタン以外では閉じない。非常に邪魔。要素外でクリックしても閉じたい そもそも『閉じる』ボタンの表示が邪魔だからいらない（とデザイナーは思った） 高機能ツールチップもいいけど、少しでも軽量化したかったので、不要なアニメーションとか永遠に使わないオプションはいらない そこで発見したのが クリックされたらツールチップを表示するスクリプトをjQueryで組んでみた …要件ぴった
ページ内リンクをスマートにするsmoothScroll.js[to-R]
ページ内リンクをスマートにするsmoothScroll.js ページ内リンクをスムーズに行うjsライブラリ、smoothScroll.jsを作成したので公開します。 どういったものかはサンプルで確認してください。 <a href="#header">ページの先頭に戻る</a> などのページ内リンクをスムーズな移動に変更します。 これにより、エンドユーザーがページが遷移したという錯覚におちいることはありません。 設置方法は簡単です。 smoothScroll.jsをダウンロードして、設置したいページで取りこみます。 <script type="text/javascript" src="./smoothScroll.js"></script> 特定のリンクはスムーズさせない smoothScroll.jsは#（ハッシュ）付きのリンクを全てスムーズスクリプトに変換します。他のライブラリなどで#
![ページ内リンクをスマートにするsmoothScroll.js[to-R]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Fblog.webcreativepark.net%2Ficon_200x200.png)
position:fixedでヘッダ固定時のページ内リンクのずれを解消したい ｜ Tips Note by TAM
position:fixedを使ってヘッダを固定した場合 ページ内リンクの位置がヘッダの高さ分ずれてしまいます。 ヘッダを固定する案件が増えてきましたので覚書です。 CSSで調整する方法と、JavaScriptで調整する方法があります。 ヘッダの高さ：100px ■HTML <div id="header"> ヘッダーがはいります </div> <div id="content"> <a href="#link01">なんとか</a> <div name="link01" id="link01">かんとか</div> </div> CSSで調整する padding-topでヘッダの高さ分ずらして、margin-topでマイナスの値をいれるとうまくいきます。 margin-top:-100px; padding-top:100px; ■CSS #header { width: 100%; m
[jQuery]別ページから特定のタブにダイレクトリンクする方法
jQueryを使うと簡単にタブを実装することができます。しかし、ただタブを作るだけではなく、他ページから任意のタブにアクセスしたい・・・なんて事はありませんか？ 例えばタブが3つ並んでいる場合に、他ページから遷移して2番目のタブをアクティブにしたい・・・等。 今回は、jQueryを使用して特定のタブにダイレクトリンクする方法をまとめてみました。 [jQuery]別ページから特定のタブにダイレクトリンクする方法 [サンプル] ここではリンク元ページをtab.html、タブページをtab2.htmlとしています。 tab.htmlにあるhrefの「#」以下を取得して、リンクに応じたタブを表示させる方法を記述します。 デモページはこちらです。 2016/04/07[追記]：ダイレクトリンクではなく、特定のタブをアクティブにするだけが良い場合はこちらの記事をご参考までに。 [jQuery]パラメー
![[jQuery]別ページから特定のタブにダイレクトリンクする方法](https://cdn-ak-scissors.b.st-hatena.com/image/square/35747428cb8fbf7cd31b60fc72cc5256327a2eca/height=288;version=1;width=512/https%3A%2F%2Firohacross.net%2Fwp-content%2Fuploads%2F2015%2F02%2Fi_wp_tab.png)
コピペでOK！スムーススクロールでページ内リンクやトップへ移動！#なしで
記事が長い場合、目次やページ先頭「#」へのページ内リンクはとても便利です。しかもスムーズスクロールで移動すれば動きもわかりやすいし気持ち良い。今回はJavaScriptやjQueryのプラグインを使わずに実現する方法です。 最近は多くのブログ・サイトで右下に「ページ先頭へ」戻るボタンやリンクを見かけます。しかしクリックして一気に最上部までワープすると味気ないし自分の位置を見失いがちです。目次の場合も同様です。 ゆめぴょんです。こんちはっ(^^)/ ページ内リンクはSEO対策にもなると聞いたことがあります。しかし私はむしろ訪問者のためのナビゲーションの1つとして便利だと思っています。 ページ内部リンクのしくみと弊害 そのしくみはとても簡単です。現在のURLの後に「#」をつけるとページ先頭へ、「#pyon」などをつけると「id="pyon"」を設定してる位置へジャンプします。 だから見出しに「
ブラウザ側で日時指定で表示・非表示を切り替えるスクリプト - Qiita
某所より要望があったので作りました。 ソースと使い方 ソースです。jQueryは別途用意してください。 $(document).ready(function() { $(".view_timer").each(function(index, target) { var startDate = $(this).attr("data-start-date"); var endDate = $(this).attr("data-end-date"); var nowDate = new Date(); if (startDate) { startDate = new Date(startDate); } else { startDate = nowDate; } if (endDate) { endDate = new Date(endDate); } if (startDate <= nowD
初心者でも分かる！モーダルウィンドウの作り方
特にスマホで活躍する、ダイアログのように浮かび上がるモーダルウィンドウ。初心者でも1から作れるよう、解説します。
jQueryで「window．open」タイプのポップアップウィンドウ方法｜BLACKFLAG
jQueryでのポップアップウィンドウといえば、ThickboxやLightBoxの様なモーダルウィンドウタイプが主流になってきていますが、そうではない単純な『target=”_blank”』『window.open』タイプのブラウザ別枠型ポップアップウィンドウ（ウィンドウサイズの指定やウィンドウリサイズ指定有り）をjQueryで実現させる方法の紹介。 サンプルでは指定を加えるリンクに対してclassを付ける構成にしておきます。 （リンクに対してclass=”popup”を付けたものに対して指定を効かせます。） HTMLは以下のような記述に。 ◆HTML <a href="リンク先" class="popup">リンクテキスト</a> そしてスクリプトの記述は以下。 ◆SCRIPT $(function() { $(".popup").click(function(){ window.op
【jQuery】クリックで画像を変更（clickとattrとtoggle） - jsdo.it - Share JavaScript, HTML5 and CSS
$(function(){ var img_name = "http://jsrun.it/assets/9/x/S/n/9xSnz.gif"; var img_name_over = "http://jsrun.it/assets/e/W/l/W/eWlWs.gif"; $("#btn01").click(function(){ $("#btn01").attr("src", img_name_over); }); $("#btn02").toggle(function(){ $("#btn02").attr("src", img_name_over); },function(){ $("#btn02").attr("src", img_name); }); }); ●clickバージョン<br> <img src="http://jsrun.it/assets/9/x/S/n/9xSn
jquery.cookie.jsの使い方とCOOKIEの寿命(保存期間)を秒・分・時間で指定する方法 - Qiita
jquery.cookie.jsを使うと、JavaScriptからクッキーの書き込み&取得が簡単に行えるようになるんだけど、何故かmax-ageが無く、expiresでしか有効期限の設定が出来ないため、最も短い期間でも１日となる。 秒・分・時で制御する場合はnew Date()からsetTime()でミリ秒指定しなければならなかったので、プラグインの基本的な使い方と一緒にメモっとく。 -プラグインはこちら- https://github.com/carhartl/jquery-cookie // 書き込み方 $.cookie('名前', '値'); // 読み込み方 $.cookie('名前'); $.cookie('ありえない名前'); // 存在しない場合は undefindedが返る // 削除 $.removeCookie('名前'); // 有効期限の設定：日数指定 $.cook
jQueryプラグイン「jquery.cookie.js」でcookieを簡単に扱う ｜ Tips Note by TAM
JavaScriptでcookieを扱うのは、値のエンコード・デコードや書き込む際の文字列結合、値を取り出す実装など、意外に面倒です。しかし、「jquery.cookie.js」を利用すれば、cookieを簡単に扱えるようになり、シンプルなコードで実装できます。 まずはjQueryとjquery.cookie.jsを読み込みます。 ※jquery.cookie.js は GitHub（https://github.com/carhartl/jquery-cookie）からダウンロードすることができます。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.cookie.js"></script> ■cookieの設定 cookieを保存するには
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【コピペで簡単】ハンバーガーメニューをCSSだけで作る方法 | ルイログ
初心者にも分かる！なアコーディオンの作り方
ヘッダを固定している時のページ内リンクのズレ補正 | Webとデザインのキタック
[jQuery]パラメータを利用して別ページから特定のタブをアクティブにする方法