[B! Javascript] [10ページ] s99e209のブックマーク

鴨川カップルシミュレーション

いくつかパタンがあります。パタン0: すぐ移動パタン1: じわじわ移動パタン2: 左右の幅の差が我慢できなくなると移動 Toshiyuki Masui masui@pitecan.com @masui Facebook

s99e209 2014/11/16

ふむふむ、Javascriptでシミュレーションコード書いているのか。勉強になる。

リンク

JSライブラリ/フレームワークの良い、悪いメモ - 素人がプログラミングを勉強していたブログ

※ただのメモで、未来志向なのであまり真に受けてはいけない。良いっぽい React.js 早速い/コンポネント志向/APIの設計がいい。JSXと他のトランスパイラの組み合わせという問題はある Promise ネイティブに入った、誰もが使ってる TypeScript ES6時代でも存在意義のある言語。TypeScript互換のFacebook Flowの動向に注目 Backbone.js ModelとEventを使う/Viewは使わなくていい Lodash Underscore.jsをよくしたやつ Gulp Gruntより良いという意味で。browserifyまわりがうまく動かない問題があってnpm runのほうがいいという噂もあるがまあ良いに分類してもいい EventEm itter Custom EventはDOMにくっ付いてる感があるのでロジック志向の物にはEventEm itter使った

s99e209 2014/11/06

JSライブラリ/フレームワークのトレンド。参考になる。

リンク

jQueryでフォームをAjax送信する際の基本パターンのチュートリアル。二重送信の防御とか。 | Ginpen.com

仕事の進みがちょいとアレなので、現実逃避もとい気分転換に。フォームの入力内容を、jQuery.ajax()を使ってサーバーへ送信したいって時のパターンです。基本的な流れフォームのsubmitを拾う通常の送信はキャンセル送信ボタンを無効化送信先URLやフォームの入力値を取得送信受信後、送信ボタンを戻す入力値をどう得るか、というのがポイントかと思います。送信ボタンを無効化するってのはやらなくても良いんだけど、誤操作防止のためにも是非やって頂きたいと思います。あと送信ボタンの制御以外にも応用がききます。デモなんかお問い合わせフォーム的なものを用意しました。まー実際にお問い合わせフォームをAjaxで送信する場面なんてないような気もするんですが、基本パターンという事で。

s99e209 2014/11/05

フォームの入力内容を、jQuery.ajax()を使ってサーバーへ送信したいって時のTIPS

リンク

[WEB開発] 私的な最近のおすすめサービス/ツール 14選〜2014年版〜 - Qiita

社内のライトニングトーク用に Qiita:Team に書こうとしていたものですが、誰かの参考になればと思い、こちらにアップします。対象は「エンタープライズ系ではない」「スクリプト言語系の」WEB系エンジニア/プログラマです。流行り廃り、好みがあると思いますが、これらは実際に、私が試してよかったものです。サービスであったりライブラリであったり粒度がバラバラではありますが、参考まで^^; 「最近の」というタイトルですが、私的に最近、活用しているという意味で、サービス自体は昔からあるものもあります。 ① Heroku Heroku を利用すると、Ruby(on Rails)、PHP、Node.js、Python 等のサーバ側アプリケーションをホスティングすることが出来ます。デプロイ方法は Git で push するだけです。商用でちゃんと使おうとすると、無料枠の構成では難しいですが、デ

s99e209 2014/10/29

WEB系エンジニア/プログラマ向け、最近話題のサービス、ライブラリの紹介。

リンク

Stack Overflowが回答にJavaScript実行環境を追加

Spring BootによるAPIバックエンド構築実践ガイド第2版何千人もの開発者が、InfoQのミニブック「Practical Guide to Building an API Back End with Spring Boot」から、Spring Bootを使ったREST API構築の基礎を学んだ。この本では、出版時に新しくリリースされたバージョンである Spring Boot 2 を使用している。しかし、Spring Boot3が最近リリースされ、重要な変...

s99e209 2014/10/22

jsdo.itみたいにStack OverflowにもJavaScript実行環境を追加されるのか。テクニカルブログ書いている人なんかは、jsdo.itかStack Overflow側にサンプルコード置くようにすれば運用が楽になりそうですな。

リンク

挙動が大事！ JavaScriptでWindow.closeする時のブラウザ別対応まとめ - TechNote

社内用のWebシステムにこれまで設置してなかった「閉じる」ボタンを設置することになった際、少々ブラウザ問題でつまずいた点があった。ググっても最近のwindow.close周辺の情報を見つけることができなかったのでまとめておく。 photo credit: flod via photopin cc １．まず、閉じるボタンの必要性２．IE（シェア：57.8%）３．Firefox（シェア：18.9%）４．Chrome（シェア：16.0%）５．safari（シェア：5.6%）６．まとめあわせて読みたい ※ちなみにバージョンはie10、firefox26.0、chrome 31、safari 5.1.7です。１．まず、閉じるボタンの必要性ブラウザには標準で×（閉じる）ボタンがついているのに、どうして閉じるボタンを自作する必要が生じるのか？一般的には、システム終了のタイミングで何らか

s99e209 2014/10/19

未だにFireFoxブラウザは閉じるボタン「window.close() 」がデフォルト設定ではセキュリティ上機能しないようになっているのか。

javascript

リンク

[JavaScript] グローバル変数とグローバルオブジェクトを取得する方法 - Qiita

JavaScript のグローバル変数とグローバルオブジェクト Webブラウザ上では window はグローバル変数だ。そのプロパティは全てグローバル変数だ。この window というグローバル変数は特別なオブジェクトでグローバルオブジェクトと呼ばれる。 var a = []; for (var i in window) { if (window[i] === window) { a.push(i); } } console.log(a.join(', '));

s99e209 2014/10/18

JavaScriptの利用可能なグローバル変数を確認する方法。

JavaScript

リンク

JavaScriptフレームワークについて個人的な思い - 当時を振り返りながら - albatrosary's blog

HTML5 Experts.jpでエンタープライズ特集が組まれたことは承知だと思います。やはり注目すべきところはJavaScriptフレームワークの見解ではなかったかと思います。JavaScriptフレームワークについては人それぞれ考えがありますので、一概にこれとは言えませんが、私が感じているところを記載したいと思います。世の中の動向と以前の判断 Googleトレンドを見る限りではAngularJSのひとり勝ちのように思えますが、身の回りの案件ではBackbone.jsが多いのではないかと思えます。１年半前にHTML5プロジェクトを行ったときに選定で残ったのが Backbone.js AngularJS Sencha Ext JS でした。最終的に利用したのはBackbone.JSだったのですが理由がjQueryベースで入り易かったということが上げられます。AngularJSは独特な記法

s99e209 2014/09/11

Googleトレンドを見る限りではAngularJSのひとり勝ち。テンプレートがHTMLベースなのでデザイナーでも入り易い、モジュールが疎結合なので分担作業が行い易いなど利点が多い。

JavaScript

リンク

jQuery でなんか書くときのちょっとした規約 - 犬ターネット

規約ってほどでもないけど、jQuery でコード書くときは以下みたいな感じで書くことが多くなった。どう書こうが好みだろうけど、jQuery オブジェクトに $ を付けるくらいはしといたほうがよい。

s99e209 2014/08/26

なるほど、今までJavascriptコード書いてて、変数の先頭に$を付ける発想が無かった。 $の有り無しでオブジェクトかどうかを区別するってのはソースが解りやすくていいな。

javascript

リンク

Javascriptを使うのをやめろ：Railsの時代遅れ云々についての結論 - Qiita

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 結論: Javascriptの乱用をやめるのが一番。はじめに書いておきますがしょうもない話です。結論、開発者としてはどのような方向性でやるべきか、を書いています。 JS多い時代でのフレームワークの根本的な問題云々のことは書いてません。さて、現状、モバイルにおいて、Javascriptでまともに動くものを作ることは難しいです。 Twitterから引き抜いた超優秀なWebエンジニアを多数抱えるMediumですら、未だにモバイルで多数のバグを抱えています。超優秀なエンジニアを世界一抱えているであろうGoogleのGmailですら、モバ

s99e209 2014/08/14

たしかに、JavascriptでUIのアニメーションを多用してたりすると応答速度が落ちるので、それが原因で離脱するユーザーはいるかもなあ。本当に必要なところでだけ使うようにしたい。

JavaScript

リンク

IE8 で擬似要素のスタイルの動的な更新ができない

JavaScript で要素のクラス属性を操作してスタイルを変更するような場合、IE8 には :before/:after 擬似要素のスタイルが再描画されないというバグがある。 <p> <a href="#" class="selected">One</a> <a href="#">Two</a> <a href="#">Three</a> <a href="#">Four</a> </p> <script src="//ajax.google apis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script> $('p').each(function () { var $links = $(this).find('a'), i = $links.filter('.selected').eq(0).index(), len =

s99e209 2014/08/13

ツールチップの表示位置によって矢印の形を変える処理をしていたら、IE8で擬似要素のスタイルの動的な更新ができないバグにハマリ中。困ったな。。

JavaScript

リンク

JavaScript初級者から中級者になろう — uhyohyo.net

このページの最終更新日：2019年7月4日 JavaScript。主にWebページを作るのに使われるほか、現在ではさまざまなところで活躍しているプログラミング言語です。このページはJavaScriptの中級講座です。最新鋭ではないかもしれませんが、読み進めれば大抵のものを自分で作れるようになることでしょう。言い訳とJavaScriptの歴史 / 問い合わせ最近の更新2017/10/05 全ページを手直ししました。十六章第六回を追加。2017/11/9 十六章第二十一回・十六章第二十二回を追加。2017/12/2 十七章第三回・十七章第四回を追加。2017/12/3 十七章第五回・十七章第六回・十七章第七回を追加。概要コンテンツは第一篇と第二篇に分かれています。 JavaScriptは昔からWebページに動きを与えるものとして用いられてきましたが、第一篇ではそのような、昔からあるJav

s99e209 2014/07/26

情報量すごい。最近勉強してなかったらHTML5になってから追加された新機能が全然解らない…。勉強しよう。

JavaScript

リンク

https://qiita.com/team-aries/items/f1e953ceb6839bab5597

s99e209 2014/07/22

ページ内リンクをスムーズスクロールさせるコード

JavaScript

リンク

[JS]Lightboxの進化形！クリックでもタップでも快適動作の画像を拡大表示させる超軽量スクリプト -Intense Images

サムネイル真ん中の風景写真は縦長 Intense Imagesの使い方 Step 1: 外部ファイル当スクリプトを外部ファイルとして記述します。 ※jQueryなど他のスクリプトは必要ありません。 <head> ... <script src='../intense.js'></script> </head> Step 2: HTML 画像は2種類の配置方法があります。 img要素はサムネイルと拡大時の画像を兼用し、data-image属性は拡大時に高解像度の画像を利用することができます。 <img src="./img/awesome-source.jpg" />  <div class="anything" data-image="./img/awesome-source.jpg" /> data-imageを使用する時は、サムネイルはCSSで背景画像として指定

s99e209 2014/07/08

Lightboxだとスマホで使った時に動作が重く感じるけど、このプラグインならJQueryだし、サクサク動きそうな予感。

javascript

リンク

片手間のJavaScriptから脱出するためにこれからのWebエンジニアが理解すべきこと - Qiita

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに最近、こういった記事が世間をにぎわせている。こりゃエヴァの話なんてしてる場合じゃねぇ！と思ってさくっとこの辺の事情を理解するために必要なことをまとめてみる。 Railsが時代に合わなくなってきた Javascriptを使うのをやめろ：Railsの時代遅れ云々についての結論昔ながらの「片手間に書くJavaScript」の限界 GoogleやTwitterでも実現できないのだから使うな問題この話は、どの地点の何の話をしているのかよくわからないのです。現在ではかなりステップバック＆改善が行われ、Safari自体のクラッシュはアプ

s99e209 2014/07/04

スマホサイトをなにかとアプリっぽくするとアプリの挙動との違いに違和感を覚えるユーザは多い。レスポンス速度を高速化するには、node.jsなどでサーバサイドを実装するか、ネイティブアプリを作るってことか。

JavaScript

リンク

wp_enqueue_script したjsファイルにphpから変数を渡す | devLog

タイトルどおりの事がしたく、調べてみるととても簡単だったのでメモ。 wp_localize_scriptというタグを使います。たとえばphpから下のようにjsを読ませて、 wp_register_script( 'sample', get_path . '/js/sample.js', "",true); wp_enqueue_script( 'sample' ); wp_localize_scriptを追加します。こんな形になります。 wp_register_script( 'sample', get_path . '/js/sample.js', "",true); wp_enqueue_script( 'sample' ); $variable_array = array( 'hoge' => 'huga'); wp_localize_script( 'sample', 'vari

s99e209 2014/07/03

wp_enqueue_scriptで定義しておいたJavascriptにPHP変数を渡す方法。こんなことが出来るなんて知らなかった...。

Javascript

リンク

使いやすいサイトを目指して！入力フォームの使いやすさを劇的にアップさせるjs厳選4点ご紹介！【DEMO付】 | 株式会社WEB企画

使いやすいサイトを目指して！入力フォームの使いやすさを劇的にアップさせるjs厳選4点ご紹介！【DEMO付】シェアつぶやくブックマーク LINE Pocket 「使いやすいサイト」に必要不可欠なのがお問い合わせフォームの使いやすさじゃないかと思います。そこで今回は、お問い合わせフォームを使いやすくする為のカスタマイズを色々試してみました。お問い合わせフォーム関連のjsは色々あるのですが、今回は導入してみて個人的に使いやすいなと思ったものを厳選して4つご紹介いたします。全てDEMO付きですので是非チェックしてみてくださいね。それではどうぞ！ 1.間違いがあったらアラートを出してくれる！：validetta.js わりと基本的な機能ですが、外せないのがこれ。入力フォームに間違いがあった場合、送信時にアラートを出してどこがどう間違ってくれるかを教えてくれます。この「validetta.j

s99e209 2014/06/23

入力フォームのバリデーションプラグイン「validetta.js」。間違いがあったら随時アラートを出してくれる。他にも郵便番号を入れると住所を自動入力してくれる「ajaxzip3.js」など色々紹介。

JavaScript

リンク

JavaScriptフレームワークはもうこりごり | POSTD

JavaScriptでフレームワークを書くのはもうやめましょう。 JavaScriptフレームワークというものは、あたかも避けられない死と税金のようなもの、絶対にぶちあたる避けられないものといわれています。こっそり聞いてみましょう、新しいウェブプロジェクトが始まるとき、一番初めに聞かれる質問は？十中八九は「どのJSフレームワーク使っているの？」でしょうね。昨今の業界においてJSフレームワークというものは本当に根深く浸透しているのです。でも、だから必須だというものではないのです。実際、もう使うべきではないのです。どうしてこういった結論に至ったのか、振り返ってみましょう。 AngularにBackbone、Ember・・・ここのところ長い間、ウェブプラットフォームとはHTML+CSS+JS、と簡潔に技術用語の羅列でまとめられてしまっていましたが、そこにはもっとぴったり表す用語“大混乱”

s99e209 2014/06/18

Javascriptフレームワークをそろそろ使おうかというときにこの記事を見てしまった。このままフレームワークの勉強を続けるべきなのか、悩みどころ。 JQueryプラグイン組み合わせれば大体解決することが多いし...。

javascript

リンク

multiscroll.js - パララックスとはまた違うスクロールエフェクト MOONGIFT

パララックスエフェクトに代表されるようにスクロールで新しい視覚効果を生み出す試みがされています。単純な上下のスクロールでは得られない大きなインパクトを訪問者に与えることができます。その新しい手法として紹介したいのがmultiscroll.jsです。スクロールによって起こる新しいエフェクトを楽しんでください。 multiscroll.jsの使い方何はともあれ動画を見るのが一番分かりやすいかと思います。いかがでしょう。スクロールすると上下から画像がスクロールしてきて合体します。パララックスとはまた違うインパクトがありますよね。最初の表示はこんな感じ。スクロールするとコンテンツが上下から表示されてきます。視覚効果は慣れてしまうと思ったインパクトを与えづらくなります。パララックスイフェクトも最近では印象が残りづらくなっているかも知れません。そこで新しい視覚効果を考えてみるのは面白いと思

s99e209 2014/06/13

画面が2分割されてスライドアニメーションするパララックスエフェクト。

JavaScript

リンク

Nyle Engineering Blog

OpenAIのWhisper 文字起こし25MB制限を解決するPHP, Laravel, ffmpegを使ったファイル分割の例 OpenAIのAPIを使った音声の文字起こしは、今や多くのアプリケーションで利用されています。この記事では、特にWhisper 文字起こしの25MB制限に焦点を当て、PHP, Laravel, ffmpeg…

s99e209 2014/05/31

AngularJSに比べて比較的学習コストが低いフレームワーク「Vue.js」

javascript

リンク

はてなブックマーク

タグ

関連タグで絞り込む (108)

Javascriptに関するs99e209のブックマーク (227)

お知らせ

今週のはてなブックマーク数ランキング（2025年1月第4週）

【完了】はてなブックマークの計画メンテナンスのお知らせ（2025年1月31日(金) 深夜1:30〜3:00）

ブックマークしたエントリーのタイトル変更機能の提供を一時的に停止します

公式Twitter

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス