今まで使っていたMediaWikiが壊れました。 お探しの「 jqueryでページの遷移(window.open、window 」ですが、確約はできませんが似たような内容をラボにてまとめていきます。 ラボのTOPページへ戻る
今まで使っていたMediaWikiが壊れました。 お探しの「 jqueryでページの遷移(window.open、window 」ですが、確約はできませんが似たような内容をラボにてまとめていきます。 ラボのTOPページへ戻る
ページの上部へ戻るボタンです。すでにホームページではなくてはならない要素です。 ボタンの用意の仕方はたくさんあります。フッターに置いたり、文章の途中に置いたり。 自分の考えだと、フッターに置くと、ページが縦に長いときに、ページ途中で戻れない。また、文章の途中だと読むのに邪魔。と思うので、ページの途中まで来ると出現するボタンが良いと思っています。 また、ふわっと出現させるのも、急にバンと出てくると読んでいる最中に気が散るので、さりげなく出すことで気が散りすぎない、かつ、気がつかせる、ので良いと思っています。 今回やりたかったこと ページの下方へ行くとふわっとページTOPへボタンを表示(フェードイン) ページの上方へ行くとふわっとページTOPへボタンを消す(フェードアウト) ボタンは画像で、ロールオーバーさせたい javascript, jqueryなどを読み込んでシンプルに 具体的な設置方法
ずいぶん以前にセレクタについて書いたのですが、今回はセレクタの種類を抜粋して、記述例と説明書きにまとめてました。「セレクタとは?」という方は、まず下記記事を読んでみて下さい。 jQueryを使ってみよう。(基本編 セレクタ1) +αというのはトラバース(走査)系のメソッドです。「この要素を抜き出したい!」と思ったときにセレクタだけでは抜き出しにくい場合があります。そういうときにトラバース(走査)系のメソッドを使うと、簡単にできたりするので覚えておくと便利なものです。 「こういう書き方をすると、こういう要素が選択される」という例で説明を添えていますが、数が多いので説明書きは、ほんとうに添えた程度です。説明だけではわかりにくいと思うので動作サンプルを用意しました。動作サンプルを眺めながら、ちらっと説明書きをチェックしてもらえれば「なるほど!」となるはず。。。ご利用ください。 jQuery セレ
JS Girls Tokyo #1で、JavaScript初心者向けの勉強方法について話しました。 私自身、HTML/CSSはできてもJavaScriptが大の苦手でしたが、@hokaccha 先生による修行によって、なんとか理解できるようになりました。 その修業の中で、何をどうやって勉…
jQueryのanimateで自由にアニメーションできるようになろう jQueryにはアニメーションをするための機能がいろいろとありますが、ここでは「animate」メソッドの扱い方をご紹介いたします。 投稿日2011年12月27日 更新日2011年12月27日 動かす前の準備 jQueryの前に動かす要素をhtml&cssで作成しておきましょう。 html <div id="box"></div> css #box { width: 100px; height: 100px; background: #3399FF; } jQueryコードを書くときの基本的な形は次のようになります。 javascript <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.m
こんにちは。kamecoです。 androidアプリをhtmlベースで作ったりしています。 それができるのも、jQueryの力でjavascriptをちょっと書けるようになったから。 ということで、jQueryを覚えよう! 電卓で入門とか色々考えたのですが、 私が覚えた方法で。。 myベストイモムシを作ろう!!!! とりあえずあなたのイモムシも用意しよう。 ダウンロード とりあえず名前を付けると愛着がわきます。 うちの子は「クロスケ」です。 ↑クロスケ。かわゆす。 練習で書いてた時から書き換えてないので、挙動がおかしいのは見逃してください。。 つまめます。動きます。顔変わります。などなど。 クロスケのjsもブログを書きながら新調してあげようと思います。 イモムシのhtml解説 これから使うhtmlですので構成や呼び出しているものを一応確認しておきます。 cssやh
LEADING BRANDS TO DIGITAL WE ARE A DATA-DRIVEN MARKETING AGENCY FICCはデータに基づく論理的なマーケティングを提供するデジタルエージェンシーです。 消費者に価値あるコンテンツと体験を届けるため、戦略立案から施策実行まで一貫して提供しています。
ブラウザのデベロッパツールのコンソールへlogを出力する方法と、 その際の注意点や解決策についてソースコード付きで解説します。 最終的にはlog出力の完成形として、 IEエラー回避、consoleオブジェクトの記述無し、デバッグ切り替え機能付きの プラグインの作成まで順を追って解説致しますので、最後までお付き合い頂ければ幸いです。 JavaScript開発において、変数の中身の確認や、処理フローの状況を確認する為には、 今まではHTMLへ出力したり、alert()等で通知したりといった事が主流でした。 しかし、ブラウザの技術進歩により、かなりJavaScript開発の手助けとなる機能が充実して来ました。 そんな中、ブラウザのデベロッパーツールのJavaScriptコンソールへ logを出力する事が可能となりました。 今回の記事では、そんなlog出力の方法と、Safari、ChromeやFi
This content refers to an older version of F12 developer tools. Please visit our latest F12 tools documentation. F12 tools enables web developers to quickly debug JavaScript code without leaving the browser. Built into every installation of Windows Internet Explorer 9, F12 tools provides debugging tools such as breakpoints, watch and local variable viewing, and a console for messages and immediate
系统提示 抱歉 可能是由下列问题导致的: 由于网络或安全的原因,您暂时无法访问本站点,请稍后重试。
ready()メソッド jQuery は、ready() メソッドを実装しています。ready()メソッドは、DOMのドキュメントオブジェクトにバインドされる、カスタムイベントハンドラで、関数を唯一の引数としてとります。 この関数にはDOMがトラバースや操作を実行できるようになったときに実行されるJavaScriptのコードが含まれます。 window.onload イベントに換えて利用できるもので、必要に応じて何度でも利用できます。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jQuery</title> </head> <body> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <s
どうでもいい話なのですが、inputタグのautocomplete属性について先日はじめてちゃんと知った気がしました(今更 それと日記見返すと、昔の方が雑記的だなぁと思った。。 うーん、そう考えるとローカルのもったいないメモは多そうだ。 今度書き出せたらいいなぁ。。 で本題ですが、先日jQueryを使っているプラグインのコードを見てて「(function($) {})(jQuery);」ってどういう意味?て思ったので、調べたりとかしてました。 謎って思ったのはおおまかに3つ。 何故全体を括弧で囲む必要があるのか。 function($)の「$」って何? 2個目の括弧の中の「jQuery」って何? これ、ほぼ「(function($) {})(jQuery);」の全てが謎っていってるようなものですねw http://q.hatena.ne.jp/1226297257 上記のURL先を参考にな
この記事は賞味期限切れです。(更新から1年が経過しています) 既知の類似プラグインは多数あるこの課題ですが、ちょっと習作してみました。 横並びにレイアウトされたブロック要素の高さを揃えるライブラリです。 なにをしたいのか 例えば、フロートなどで横並びにした要素があって、それぞれの高さを揃えたい時があります。 こんな感じに。この処理をしてくれるライブラリを書いてみます。 書いてみた物 jQuery.lineUp 使い方 例えばこんな要素があるとして <div class="items"> <!-- 異なるコンテンツ量のブロック達 --> <div class="item">...</div> <div class="item">...</div> <div class="item">...</div> <div class="item">...</div> <div class="item"
ブロック要素をfloatで横並びにした時に高さが合わなくなって、見栄えが悪くなってしまうことってありますよね。 原因は要素内にあるテキストの文字数によって要素の高さが変わってしまうからなんですけど、さて、こんな時どうします? 一応、スタイルシートでdivのheightを指定するやり方が単純なんですけど、テキスト部分が動的に出力されているとしたら?文字数が多かった場合にはみ出してしまいます。 というわけで一番文字数が多くて高さの高い要素に、全体の高さを揃えてやる方法を紹介します。 jQueryで高さを揃える方法 指定した要素を一つづつ検証して、高さの最大を取得した後、指定した要素の高さを一番高い要素に揃える処理。 function even_height(elm){ var h = 0; elm.each(function(){ if(h<$(this).height()){ h = $(
jQueryでブロックレベルの高さを揃える jQuery2011年1月12日 ブロックレベルの高さを揃えるJavascriptは多く紹介されていますが、jQueryで容易に実現することが可能です。 以下の3通りの条件で高さを揃えたサンプルを作成してみました。 クラスを付与した要素の中にあるdiv全ての高さを揃える クラスを付与した要素同士の高さのみ揃える カンマで区切った要素同士の高さを揃える 実際のサンプル HTML <div class="hoge-01"> <div>カラム1カラムカラムカラムカラムカラムカラムカラムカラムカラムカラムカラムカラムカラム</div> <div>カラム2カラム2カラム2カラム2カラム2カラム2</div> <div>カラム3カラム3カラム3カラム3カラム3カラム3カラム3カラム3カラム3カラム3カラム3カラム3カラム3カラム3カラム3</div> </d
お疲れ様です、デザイナーのモモコです。 コーディング中にいざ本番の文言を入れたら、予想以上に長さがバラバラで見た目が揃わない…!なんてこと、ありますよね。今回はそんな時に活躍してくれるブロックレベル要素の高さを揃えるjsを3つご紹介します。 heightLine.js 配布ページ <script type="text/javascript" src="heightLine.js"></script> class名のつけ方によって高さを揃える要素をコントロールできるJavascriptです。 子要素の高さを統一できる「heightLineParent」が便利で良くお世話になっていました。 jQueryAutoHeight.js 配布ページ※このページは現在削除されています。 <script type="text/javascript" src="jquery.js"></script> <s
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く