Moment.js 2.30.1 Parse, validate, manipulate, and display dates and times in JavaScript. Install npm install moment --save # npm yarn add moment # Yarn Install-Package Moment.js # NuGet spm install moment --save # spm meteor add momentjs:moment # meteor bower install moment --save # bower (deprecated) Format Dates moment().format('MMMM Do YYYY, h:mm:ss a'); moment().format('dddd'); moment().format
論理演算子「&&」「||」について JavaScriptの基本である論理演算子の && || について、 根本的に勘違いをしていたことに最近気付いたので自戒の意味を込めてここに記します。 論理演算子の使い道 1. お馴染みの使い道「条件処理」 JavaScriptには皆さんご存知の通り論理演算子&& ||が存在します。 それぞれ「AND」「OR」という意味で、条件処理の中で使うことが多い演算子です。 // aとbに0または1を足し続ける // aとbのどちらかが最大値に達すると終了 var a = 0, b = 0, max = 50; // 条件式その1 AND while (a < max && b < max) { // 0または1を足す a += Math.round(Math.random()); b += Math.round(Math.random()); console.l
<p>jQueryの練習</p> <ul id="main" data-hoge="datahoge"> <li>0</li> <li class="item" data-index="one">1</li> <li class="item">2</li> <li> 3 <ul id="sub" class="hoge" style="padding: 5px; border: solid 10px #0000ff;"> <li><div>hoge</div></li> <li id="sub1">3-1</li> <li id="sub2" class="item">3-2</li> <li class="item">3-3</li> <li>3-4</li> </ul> </li> </ul>
Designer Contentアドオンを使うなどして、ブロックタイプを新しく作成する際、そのブロックがページ内に存在するときだけ呼び出されてほしいJavascriptやCSSファイルがあった場合の読み込ませ方です。 基本的には、ブロックタイプのディレクトリ内に view.js または view.css というファイル名でJavascriptファイル、またはCSSファイルを置くと、自動的に読み込まれます。例えば、ブロックタイプハンドルが example だった場合、 blocks/example/view.js と blocks/example/view.css は、ページ内にそのブロックタイプのブロックがひとつでもあると自動的に読み込まれます。 複数のJavascriptファイルやCSSファイルを読み込ませたい場合は、js または css というディレクトリを作成するだけで、その中のJa
1. はじめに 1-1. 技術の概要 エンジニアの技術は、かなりざっくり言うと、 フロントエンド → 見える部分。 (例)HTML、CSS、JavaScriptなど サーバサイド → アプリケーションを動かす中身の部分。 (例)Java、PHP、Ruby、C、C++、Perlなど インフラ → Webアプリケーションを動かすための環境構築など。 (例)Webサーバ構築、DBサーバ構築、DNSサーバ構築など の3つに類別できる。 その中で、プログラミング未経験者が最も手をつけやすいのが、フロント(HTML、CSS、JavaScript)の技術である。 ※ 上記は、「Webアプリケーション開発」のお話です。 ※ 「ネイティブ開発」ではObjective-C/Swift/AndroidJava/Cocos2d-x/Unityなどがよく使われる。 1-2. フロントの概要 フロントの技術を学ぶため
jQuery and its cousins are great, and by all means use them if it makes it easier to develop your application. If you're developing a library on the other hand, please take a moment to consider if you actually need jQuery as a dependency. Maybe you can include a few lines of utility code, and forgo the requirement. If you're only targeting more modern browsers, you might not need anything more tha
#と6桁(もしくは3桁)の英数字(正確には16進数で表記される0から9、aからfの英数字)からなるカラーを、RGBでの数値に変換、もしくはRGBから16進数に変換、はたまた補色や反転色はどんなのか?それをJavaScriptで取得できるようにしてみました。 Color.infoというメソッドを用意して、その引数に16進数もしくはRGB値をセットして実行すると、補色や反転色、RGB値などの色情報が返却されるようにしました。 ロジックはAdobe Illustrator CS4 * カラーの反転色または補色への変更を参考に制作。ロジック部分を抜粋。 反転 カラーの各構成要素をカラースケール上の反対側の値に変更します。例えば、RGB カラーの R の値が 100 の場合に「反転」コマンドを実行すると、R の値は 155 に変更されます(255 – 100 = 155)。 補色 カラーの各構成要素
去年にこれ(日付フォーマットなど 日付系処理) 書いたんだけど(思いの外ストックされた)、 これはライブラリ使用承認プロセスがとても難儀な環境の時書いたもので、 もしそんな悲しい環境でないなら先人たちの素晴らしいライブラリを使ったほうがいい。 ライブラリを使ういいところは、コーダの独自実装になりにくいし、他のプロジェクトでも知見が使い回しできるところだと思う。 ということでMoment.jsの使い方について書いておく。 GitHubにおいて、現在(2015/1)日付を処理するライブラリの中で多分一番Starがついてる日付系のライブラリ。人気が有るということは正義っぽい。 Qiitaにもたくさん記事ある。 公式ドキュメントはこちら。 http://momentjs.com/docs/ Moment.jsはJavaScriptのDateオブジェクトをラップするオブジェクトを生成して、そのオブジ
では早速、Node.jsを用意しましょう。Node.jsは現在、以下のアドレスにて配布されています。 http://nodejs.org/ また、Node.js日本ユーザーグループによる日本語サイトもあり、以下のアドレスからもダウンロードできます。こちらのサイトでは主なドキュメントなども少しずつ日本語化して公開されていますので、英語が苦手な人はこっちにアクセスしましょう。 http://nodejs.jp/nodejs.org_ja/ サイトの表示などは常に変わっていますからページなどは変わっている可能性もありますので、もし見つからなければ本家のnodejs.orgからダウンロードページを見つけてください。 http://nodejs.org/download/ このページに行けば、現時点で公開されている各プラットフォームのプログラムがすべてまとめられています。ここから必要なものをダウンロ
twitter facebook hatena google pocket 最近ページ遷移でおしゃれに動いているサイト多くなりましたよね。 実現したいなーって人多いんじゃないでしょうか。 jQueryプラグインのAnimsitionならそりゃーもうさくっと実現できますよ! sponsors 使用方法 Animsitionからファイル一式をダウンロード。 <link rel="stylesheet" href="animsition.css"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="animsition.js"></script> <script type="text/javascript">
2013年05月08日18:21 JavaScript 実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 さて、先日簡単なチュートリアル作ろうと思ったんですが、どうやるのが良いのかなーと思って悩んでました。キャプチャ取ってそこに説明文を書いて…ってしてもいいんですけど、キャプチャだと一部分なのでサイト上のどの辺なのかわかりにくかったり、サイト側は変更したのにキャプチャが古いままとかになったりしちゃいますよね>< とか思って探してみたらこちらの Intro.js が便利だったので紹介してみます。 さて、この Intro.js を使うとですね、サイト上で動作するチュートリアルを簡単に作れるんですよ。使い方も簡単で、動作させたい要素に対して data-intro (表示する説明文) と data-step (チュートリアルの何番目に表示するか) を指定します。チ
ページ内リンクをスマートにするsmoothScroll.js ページ内リンクをスムーズに行うjsライブラリ、smoothScroll.jsを作成したので公開します。 どういったものかはサンプルで確認してください。 <a href="#header">ページの先頭に戻る</a> などのページ内リンクをスムーズな移動に変更します。 これにより、エンドユーザーがページが遷移したという錯覚におちいることはありません。 設置方法は簡単です。 smoothScroll.jsをダウンロードして、設置したいページで取りこみます。 <script type="text/javascript" src="./smoothScroll.js"></script> 特定のリンクはスムーズさせない smoothScroll.jsは#(ハッシュ)付きのリンクを全てスムーズスクリプトに変換します。他のライブラリなどで#
開発者泣かせの問題児ブラウザ、Internet Explorerですが、IE5.5、IE6、IE7、IE8をモダンブラウザの挙動にする神JSがGoogle Codeで配布されていました。 とりま、 attripのデザイン崩れはこれで解決できました! 使い方は簡単!下記のコードを貼り付ければOK! まじ仏。 「IE9.js」は、IEを普通のモダンブラウザの挙動にするJSです。IE5、IE6でも透過PNGが使えるようになります。 「css3-mediaqueries.js」は、IEでCSS3 Media Queriesを使えるようにするJS。レスポンシブデザインのサイトをIEでも見れるようにします。 ちなみに、border-radiusや、box-shadow はできませんでした。 あと、IEでの見え方をチェックする方法はこちら↓↓ IE9環境でIE6/IE7/IE8/IE9表示する方法(共存
HTML,CSS,JS,Perl,PHPなどの各ソースコードをWebサイト上に綺麗に再現。 NetyaSun ソースコード表示 ホームページ 作成、運営、管理ガイド 行番号や各行背景色で見やすい ソースコード ビュー ライブラリ SyntaxHighlighter エディタのようにWebサイト上に綺麗にソースコードを表示する方法。 ソースを書くプロ達や未来の開発者のための学びの場である HTML,CSS,JS,Perl,PHPなどのマニュアル・解説サイトなどで、 PREソースコードを行頭番号付きでカッコよく表示するソース ビューア SyntaxHighlighter SyntaxHighlighter:Download ソース上にオンマウスで の操作タブがソースの右上に表示されるようになった。 ソースを別窓ビュー表示したりクリップボードに保存や印刷も可能な優れものです。 <?xml ve
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く