p5.js
p5.js is a friendly tool for learning to code and make art. It is a free and open-source JavaScript library built by an inclusive, nurturing community. p5.js welcomes artists, designers, beginners, educators, and anyone else! Lauren Lee McCarthy reading the Processing Community Catalog. Photo credit: Maximo Xtravaganza. Coding Club for people aged 50+ in Korea, led by Inhwa Yeom. Qianqian Ye intro
ページサイズやスクロール位置を取得する - Archiva
Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。 現在位置を取得するときのの基準となる、ウィンドウ・サイズ、ドキュメント・サイズ、スクロール量を取得するJavascript。ブラウザ互換とかで割りと苦労しました。 スクロール量（横）: スクロール量（縦）: ウィンドウ・サイズ（横）: ウィンドウ・サイズ（縦）: ウィンドウの中央位置（横）: ウィンドウの中央位置（縦）: ドキュメント・サイズ（横）: ドキュメント・サイズ（縦）: 以下にソースを出します。 スクロール量を取得 function getScrollPosition() { var obj = new Object(); obj.x = document.
スマホWebサイト/ハイブリッドアプリ開発を高速化するJavaScriptフレームワークまとめ | BACKEND AS A SERVICE mbaas BLOG
デスクトップ向けのWebサイト開発ではjQuery/Backbone.js/AngularJS/Ember.jsなどを採用するケースが多いのかなと思います。しかしスマートフォン、タブレット向けのWebサイトとなるとまた勝手が違います。特にUI周りの取り回しであったり、タッチ/マルチタッチイベント、スマートフォン特有のAPIなどを適切に扱えなければなりません。何よりハードウェアの性能がデスクトップより低いので高速にストレスなく動作させるためには軽量でなければなりません。そこで今回はスマートフォン、タブレット向けのWebサイトを構築したり、HTML5によるハイブリッドアプリを開発するのに使えるJavaScriptフレームワークを紹介します。ぜひ皆さんの開発に役立ててください。mBaaSお役立ちブログ トップ> ブログ> Tips> スマホWebサイト/ハイブリッドアプリ開発を高速化するJava
Web フロントエンド開発用パッケージマネージャ component について
Takuto Wada @t_wada TJ が component を開発するにあたっての所信表明エントリ。なぜ npm や bower や browserify とは別のものを開発することにしたか。 / “Components - TJ Holowaychuk” htn.to/713F39
ニコ動 超チューニング祭で最優秀賞もらいました
ニコニコ超会議で開催された「超チューニング祭り」に恋人である武藤スナイパーカスタムからお誘いされて参加しました。 投票してくださった方々のおかげで最優秀賞！ ありがとうございます！ ニコ動モバイル版のトップページのhtml,css,jsを軽量化するお祭りでして、にぎやかな会場、狭いブースの中で詰め込まれておもしろかったです。 チーム：ウルフギャングの紹介 エンジニア、デザイナーのバランスチーム。 武藤さんが狼が好きなのでそれっぽい名前にしました。ギャングらしくふたりとも革ジャン装備。 武藤スナイパーカスタム Twitter : tai2 コンピューターグラフィックスとPythonをこよなく愛すマッチ棒エンジニア。 イシジマミキ Twitter : woopsdez 写真をアップするたびにおおつねさんに「太った？」と言われる番付上昇中のデザイナー 他はエンジニアふたり、個人での参加などが
"note"がAngularJSでどうやってSEO, Open Graphの対応をしているか｜和田 晃一良｜note
noteはAngularJSを使って、ブラウザで描写しているこの"note"というサービスはAngularJSを使って、JavaScript側（つまりブラウザ側）でノートの中身を公開しているみたいなのです。 それはブラウザでソースを見てみるとわかります。 例えばhttps://note.mu/sadaaki/n/nd921f3f7c635のノートのソースをChromeで見てみると・・・ まずhtmlタグにng-appのプロパティがついています。これはAngularJSを使うならば必要なプロパティで、ここからnoteはAngularJSを使っているんだなあと分かります。 AngularJSは簡単に言うと、サーバー側ではなくブラウザ側でHTMLを描写する仕組みです。これを利用するとどんな利点があるのか。僕の理解している範囲内だと、サーバー側はベースとなるHTML（上のソース）と各ノートのJSO
Owl Carousel
How To Use 1. Load jQuery and include Owl Carousel plugin files To use Owl Carousel, you’ll need to make sure both the Owl and jQuery 1.7 or higher scripts are included. <!-- Important Owl stylesheet --> <link rel="stylesheet" href="owl-carousel/owl.carousel.css"> <!-- Default Theme --> <link rel="stylesheet" href="owl-carousel/owl.theme.css"> <!-- jQuery 1.7+ --> <script src="jquery-1.9.1.min.js"
三章第二回 イベントリスナ — JavaScript初級者から中級者になろう — uhyohyo.net
三章第二回 イベントリスナこのページの最終更新日：2017年8月1日 addEventListener前回はJavaScriptから要素にイベントを登録する（イベントが起こったとき関数が呼ばれるようにする）方法として、イベントプロパティによる方法を紹介しました。 しかし、それは諸々の点から推奨されない方法でした。今回はよりDOM的にイベントを登録する方法としてaddEventListenerを紹介します。 <!doctype html> <html> <head> <title>test</title> </head> <body> <p id="abcd">test</p> <script type="text/javascript"> function aaa(){ console.log('aaa!'); } var p = document.getElementById('abcd
Create a Simple Infinite Carousel with jQuery
Introduction Finally, I have times for this carousel script. I always think that it's hard to figure it out, but thanks to a tutorial - Making a jQuery Infinite Carousel with nice features from tutsvalley. I learnt something new from there. So, yes, I modify the code and make it into something I want, and hopefully this is what you want as well :) 1. HTML Alright, We have a main wrapper called car
jQuery Carousel Free Download
How to create this jQuery Carousel? Carousel jQuery Live Demo [Screencast]? jQuery Image Carousel HTML Code Code to paste between the tags <head></head>: <!-- Start WOWSlider.com HEAD section --> <link rel="stylesheet" type="text/css" href="engine1/style.css" /> <script type="text/javascript" src="engine1/jquery.js"></script> <!-- End WOWSlider.com HEAD section --> <!-- Start WOWSlider.com BODY se
そのコード、本当にjQueryが必要ですか？ネイティブ関数の代替Tips集 | ゆっくりと…
sitepoint から「本当にjQueryが必要ですか？」とタイトルのついた3本の記事を紹介します。 Do You Really Need jQuery? Native JavaScript Equivalents of jQuery Methods: the DOM and Forms Native JavaScript Equivalents of jQuery Methods: Events, Ajax and Utilities 言うまでもなく著者の Craig Buckler さん の趣旨は、「jQueryを使うのは止めよう」ではありません。ネイティブ関数で代替えできるのは、古い IE のサポートが必要なく、ごく簡単なケースに限られます。その代わりに得るものは「速さ」です。そこで、どの程度「速い」のかを所々 jsperf の結果で補ってみたいと思います。 また JavaScri
AlloyUI
⚠️ AlloyUI is deprecated and only critical patches will be released in the future. See blog for more Simply Powerful Robust UI tools at your fingertips. AlloyUI is a framework built on top of YUI3 (JavaScript) that uses Bootstrap (HTML/CSS) to provide a simple API for building high scalable applications. Download Fork 1 - Copy and paste First load the seed and CSS files. <script src="https://cdn.a
Font Hacking
30th March 2013What if I told you there was a way to radically alter your web pages without using images, javascript, proprietary CSS3 or any extra markup? What if I told you you didn't have to be an experienced typographer, you could do it for little more than 6Kb and that it would work in Internet Explorer 7? For free? Welcome to Font Hacking, my primer on extracting, deconstructing, altering an
Intro.js - Step-by-step guide and feature introduction for your website
No dependencies, fast and small 10KB JavaScript and 2.5KB CSS, that's all (minified, gzipped). User-friendly Navigate using keyboard or mouse. Easily change the themes for your website. Browser compatibility Works on Google Chrome, Mozilla Firefox, Opera, Safari and even Internet Explorer. Why using Intro.js? When new users visit your website or product you should demonstrate your product features
円や棒グラフをサポートしたCanvasによるグラフライブラリ·Chart.js MOONGIFT
Chart.jsはHTML5/Canvasを使ったグラフライブラリです。 Web上で管理画面を提供する場合必要になるのがレポートです。そこにはただの数値の羅列だけでなく、グラフがあるとインパクトが違うでしょう。そこで使ってみたいライブラリとしてChart.jsを紹介します。 折れ線（曲線）グラフです。 棒グラフ。 レーダーチャート。 円のエリアグラフ。 円グラフ。 ドーナッツチャート。 Chart.jsはHTML5/Canvasで表示されているのが特徴です。なおサポートブラウザとしてはIE7から対応しています。対応しているグラフは折れ線、棒、レーダー、円のエリア、円、ドーナッツの6種類になります。表示の際にはアニメーションが実行されますが、その後はマウスクリックなどには反応しないようです。 Chart.jsはHTML5/JavaScript製、MIT Licenseのオープンソース・ソフト
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Internet Explorer デベロッパー センター
ここにGitHubを便利に使うUserScriptが2つあります - slowjet
捗るかもしれないフロントエンド開発環境
写真スライド jCarousel - Riding carousels with jQuery
DevDocs
