フロントエンドのパラダイムを参考にバックエンド開発を再考する / TypeScript による GraphQL バックエンド開発
JavaScriptフロントエンド開発の昨今
フロントエンドのパラダイムを参考にバックエンド開発を再考する / TypeScript による GraphQL バックエンド開発
jQueryでシンプルなループスライダーを作る
JavaScriptというかjQueryのお勉強。 練習がてらコンテンツスライダーを作ってみました。 この手のものはチュートリアルもプラグインも山ほどありますが、必要な機能だけあって好きに使えるものが欲しかったので1から作りました。 プラグインをお求めの方は「jQuery.simpleLoopSlider.js」をどうぞ。 欲しかった機能シンプルに動くコンテンツスライダー。ループ機能。最後の次は最初、最初の前は最後、という感じで動く。進む、戻るナビゲーション。自動でページネーションを設置。これをやります。 デモとダウンロードは以下からどうぞ。 jQuery Simple Loop Slider DEMO デモファイルをダウンロード HTMLとCSS<div id="slider"> <div class="slider-view"> <div class="slider-container
スクロール途中から位置が固定されるナビゲーションを作ってみる
ある程度スクロールすると、途中から位置が固定になるコンテンツを見かけたことはありませんか？ 今回はjQueryを使ってそれを作ります。 デモ1 デモ2 途中から位置が固定されるナビゲーションのデモ 1 & 2 ダウンロード 今回使うHTMLはこんな感じです。 <div id="header"> <h1>タイトル</h1> </div> <div id="container"> <div id="main">左カラム（メインコンテンツ）</div> <div id="sidebar"><!-- サイドバー --> <div id="nav">ここを固定する</div> </div> </div>#mainと#sidebarはfloat: leftしています。 これの#navが表示エリア上部から20pxの位置まで来たら位置を固定したいと思います。 position: fixedを使って固定する
JavaScriptの動かないコード (JavaScriptエラー集) - 主に言語とシステム開発に関して
「このJavaScriptコードが動かないのは，なぜですか？」というミニクイズ集。 すべて制限時間は１分。 別名，JavaScriptのエラー事典。またはアンチパターンのまとめ。 中級編 初級編 番外編 2015年５月現在，全５３記事。 中級編 JavaScriptの仕様関連 p要素への appendChild() で失敗する かけ算を間違える イベントハンドラが見る値のエラー クロージャを使わない場合に起きるエラー オブジェクトのprototypeを変更した時のエラー 正規表現で同じ文字の連続を検出したい - 置換前パターン中での後方参照 jsonオブジェクトをevalできないエラー 不要なイベントが連鎖で発生してしまう （バブリングの対処） オブジェクトのプロパティ定義にthisを使って失敗するエラー setTimeoutのタイマーが指定時刻に動かないエラー オブジェクトのメソッドを
Liveweave HTMLエディター
Check out our Python playground! Python is the most popular general-purpose programming language in the world, widely used in Artificial Intelligence, Machine Learning, and Data Science projects. Supports popular Python libraries like Numpy, Matplotlib, SciPy, Pandas, and more! Share your public code with anyone, or make it private Features advanced auto-completion technology Try it now!
Re:初心者のコーダーでも簡単に実装出来るJavaScript/jQuery Tips
Re:初心者のコーダーでも簡単に実装出来るJavaScript/jQuery Tips ネタ元:初心者のコーダーでも簡単に実装出来るJavaScript/jQuery Tips : アシアルブログ ちょっと気になるコードがあるのでツッコミを。 １．現在見ているページのナビゲーションをアクティブにする if (document.URL.indexOf("001.html") != -1) { $("nav a.top").toggleClass("on"); } else if (document.URL.indexOf("002.html") != -1){ $("nav a.list").toggleClass("on"); } class属性の付加にtoggleClass()を利用しているけどaddClass()のほうがシンプルでよいです。 if (document.URL.index
ブックマークレットの作り方を知ってウェブブラウジングを快適に。（JavaScriptおれおれAdvent Calendar 2013 – 04日目） | Ginpen.com
この記事はJavaScriptおれおれAdvent Calendar 2013の4日目の記事です。 ブックマークレットてご存じですか？ ブックマークにJavaScriptを登録して、あれこれの機能を使おうというものです。 説明ははてなのページがわかりやすそう。 ブックマークレット – はてな Mobile Safariでも利用する事が出来ます。 例えば ウェブページのタイトルとURLをコピーしやすく提示 何かのページを見ていてTwitterに流したいなーってときに使ってます。 javascript:prompt(”,document.title+’ ‘+location.href);void 0 みてる / Web Components/Polymerを軽く触ってみる | inkdesign http://t.co/iW2c1XzEdV — 高梨ギンペイ (@ginpei_jp) 2013
JavaScript側にPHP変数を簡単にまるごと渡す方法 #FuelPHPAdvent2013 - Blog::koyhoge::Tech
ハイ、昨日のオレに引き続きFuelPHP Advent Calendar 2013の6日目です。 今回の内容もまたTwig絡みです。実は昨日の記事は、本日の記事の前準備になっていたのでした。 JavaScript側にPHPのオブジェクトを渡したい 最近のWebアプリはUIのインタラクションが凝っていて、ブラウザ側のJavaScriptで色んな制御をすることも当たり前になってきました。jQueryや様々なjQueryプラグインを駆使して、ユーザに分かりやすく使いやすいサービスを提供することは、もはやウェブエンジニアとしては持っていて当然のスキルになっています。 そのようなUIを作っている際に、JavaScript側に動作パラメータの初期値を渡すのに値を一つ一つテンプレート記法で埋め込むのが面倒だったので、一発で渡せるTwig Extensionを作ったので紹介します。 data_bind関数
【JavaScript】jQuery Mobileの紹介 - 株式会社アンフィニ 技術ブログ
こんにちは。うら@infiniです。 今回はjQuery MobileというjQueryベースのモバイルフレームワークを紹介します。 jQuery Mobile jQuery Mobileは、AndroidやiPhoneなどのWebkitベースのスマートフォン向けのページ作成ができます。 HTMLの要素に属性やクラスを指定するだけで、きれいなUIを作ることができます。 jQuery Mobileを使用するには、jQuery MobileとjQueryをダウンロードします。 使ってみる まずはHTMLファイルを作成し、そのファイルにjQuery Mobileを読み込ませてみましょう。 <html> <head> <title>Sample</title> </head> <body> <div> <div> <h1>ヘッダ</h1> </div> <div> <ul> <li>リスト01</
JavaScriptではじめるプログラミング超初心者講座 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
あ、どうも僕です。 今回は、プログラムって、なんか難しそうと思って敬遠してきた方や、これからはじめようという超初心者の方向けに、プログラミングの超初心者講座をしたいと思うよ！ プログラミング見ただけで嗚咽しちゃう人とかいるよね！いた！ぼく！何だろう！職業病かな！ とにかく今回は、プログラミングに触れたことない人や、挑戦したけど挫折した人向けに、JavaScriptを題材にして、超初心者講座をやってみようではないか！ 開発環境をそろえよう まずは開発環境をそろえよう！プログラムって何があればかけるの？ テキストエディタ ブラウザ これだけ！ これだけあればプログラミングができるんだよ！ テキストエディタは何でもいいよ！ Windows標準のテキストエディタでも、Macのテキストエディタでも。 要は、テキストがかければ何でもOK！ プログラムってとっても敷居が低いんだね！ 最近だと昔はえげつな
CSSやJavaScriptでツールチップを表示させる方法まとめ
#sample1 li { position:relative; } #sample1 li:hover { background: #deb3ba; } .sample1-tooltips { display: none; position: absolute; bottom: -2.8em; left: 0.3em; z-index: 9999; padding: 0.3em 0.5em; color: #FFFFFF; background: #c72439; border-radius: 0.5em; } .sample1-tooltips:after { width: 100%; content: ""; display: block; position: absolute; left: 0.5em; top: -8px; border-top:8px solid transpa
JavaScriptのいろいろなコーディングルールをまとめてみた
JavaScriptの書き方はJavaScript自体がある程度自由なためいろいろな書き方ができますが、一貫性を持って書いた方がバグなども発生しにくくなるため、コーディングルールを定めておくのはよいことだと思います(特に複数人の開発の場合) 有名な企業やライブラリはコーディングルールも公開している事が多いので適当にまとめてみました JavaScript style guide – MDC Docs Mozilla/Firefox向けのものなので、一部ECMAScriptの範囲を超えたものも含まれています。 多くの人が見ていると思うので、見たことない人は一度読んでみるといいです。 jscsにこのコーディングルールをチェックするプリセットが用意されています。 Google JavaScript Style Guide Google JavaScript Style Guide 和訳 — Goo
JavaScript - MDC
JavaScriptチュートリアルBeginner's tutorialsYour first website: Adding interactivityDynamic scripting with JavaScriptJavaScript frameworks and librariesJavaScript ガイド入門編文法とデータ型制御フローとエラー処理ループとイテレーター関数式と演算子Numbers and stringsRepresenting dates & times正規表現インデックス付きコレクションキー付きコレクションオブジェクトを利用するクラスの使用プロミスの使用JavaScript 型付き配列イテレーターとジェネレーターInternationalizationJavaScript モジュール中級編Advanced JavaScript objectsAsynchrono
10 Must Have JavaScript Tools For Developers
JavaScript tools are still one of the most difficult issues when it comes to web-development. Many tools and applications could make your developing life pretty fast and simple. A few years back people only used JavaScript to add some effects like the blinking text etc but in the then people started taking it a lot more seriously, as it can enhance the web. So here are 10 great tools and script fo
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScriptユーティリティライブラリの紹介
chrome-life.com
2013年チェックしておきたいスタイルシートやスクリプトのスゴ技たち -Top Pens of 2013
JSX 速さの秘密 - 高速なJavaScriptを書く方法
Site Under Maintenance
jsdares