【JavaScript】a要素のhrefから絶対パスの取得 at softelメモ
問題 リンク（a要素）のリンク先（href属性）の絶対パスを取得したい。 HTML中には相対パスで書いてあるんだけど。 答え ここにa要素を用意 → ソフテルのコーポレートサイトはこのブログ記事の上の上の上の階層です リンク先は「../../../index.php」。 DOM関数で document.getElementById("ID").href jqueryで $("#ID").prop('href') でも getAttributeを使うと？ //hrefに書いた文字そのまま document.getElementById("#ID").getAttribute("href") //でも古いIEだけ違う動きをするかも
スマホ対応の参考に。JavaScriptでウェブページがどのくらい拡大されているのかを取得する方法。
こんにちは。開発担当の林です。 iPhone / iPad のウェブブラウザでページを見ているとき、けっこうな割合でピンチイン・ピンチアウトすると思いますが、それがどのくらい拡大されているのかを取得する方法を書きます。 また、応用でピンチイン・ピンチアウトされても、見た目のサイズを維持するにはどのくらい拡大すれば良いかということにも触れたいと思います。 広告バナーなんかでよく使われてるアレの仕組みです。何かのお役に立てれば幸いです。 ウェブページがどのくらい拡大されているのかを取得する // ページの幅 ÷ 表示されている幅（この行だけでいいかな） var zoomer = document.body.clientWidth / window.innerWidth; // 以下で拡大率を目視できるでしょう alert( zoomer ); // 小数点がたくさんつくので、第二位までに丸め込
jQueryだけ使うのが馬鹿らしくなる。KnockoutJSに触れる
久保田です。最近KnockoutJSというJavaScriptフレームワークを勉強しています。 KnouckoutJSはjQueryの上に構築されているフレームワークです。jQueryのみ使うのと比べてKnockoutJSを利用すると、ウェブページ上のインタラクションを圧倒的に簡単に記述できます。この記事では、簡単にKnockoutJSの概要を説明し、KnockoutJSを用いたデモを紹介します。 このフレームワークの特徴としてあるのは、HTML内に宣言的な記述を埋め込むことでインタラクションが実装できることです。HTML5のカスタム属性(data*属性)を用いて、その要素に関する処理を宣言してきます。裏側の処理は、JavaScriptでViewModelを定義し、そこにビューが必要とする値を管理します。 例えば、あるチェックボックスにチェックを入れると下の要素がトグルする簡単な例は、以下
【iPhone/iPad】ホームに置いたWebアイコンからSafari以外のアプリを開かせるJavaScriptを作りました
こんにちは！林です。 今回は、iPhone アプリ開発者 / ウェブ開発者向けの記事です。 みなさんは、iPhone の Safari にある「ホーム画面に追加」という機能をご存知でしょうか。 以下の図のように見ているウェブページを、ホーム画面にアプリのように置くことができる機能です。 ホームに置かれたアイコンをタップすると、Safari が起動し、そのウェブページを閲覧できる仕組みになっています。 頻繁に使うページをホームに置いておくと大変便利です。 この機能を利用して、 アイコンから任意のアプリ(※1) を起動する JavaScript を作成しました。 ※1 URI スキームに対応しているアプリのみ対応しています。 使い方 設置方法は </head> の直前に１行、スクリプトタグを追加するだけです。 ※ デフォルトでは、Sleipnir Mobile で開くようになっています。 <s
jQueryを学ぶためのリンク集
1. 概要の理解 jQueryを一切知らない場合はまずは概要の理解から始めます。 ノンプログラマーのためのjQuery入門 http://www.slideshare.net/hayatomizuno/jquery-7665168 はじめてのjQuery http://higashizm.sakura.ne.jp/jquery_first/ 2. 基本的な使い方を理解する サンプルを見ながら具体的なコードを作成し理解を深めます。 40分で覚えるjQuery速修講座 http://ascii.jp/elem/000/000/498/498710/ jQuery基礎文法最速マスター http://blog.webcreativepark.net/2010/02/02-111519.html jQueryサンプル集 http://www.designwalker.com/2008/04/jque
[JS]Flashでもない、HTML5でもない、タイムラインベースの複雑なアニメーションを作成できるスクリプト -Mashi | コリス
ぱっと見た瞬間「Flashだな」と思ってしまったくらいの、Flashで実装したような複雑なアニメーションやムービーを作成できるスクリプトを紹介します。 使用するのはHTML, CSS, JavaScriptで、こういったものにありがちなHTML5, Canvas, CSS3には頼っていません。jQueryなど他のスクリプトにも依存していません。 ※CSS3のエフェクトなどオプションとして利用が可能です。 Mashiの主な特徴 スタンダードなHTML, CSS, JavaScriptでFlashのようなムービー、アニメーションを作成できます。(X)HTMLコンテンツに設置が簡単にできます。 41KB/13KB(CDN+GZip)と非常に軽量で、オブジェクト指向、モジュール式です。 基本的な利用では、追加のプラグインは必要ありません。 IE6をはじめ、すべての主要なブラウザをサポートしています
iPhone/Android/PC 対応。jQuery で書くタッチイベント
こんにちは！プロダクト企画担当の林です。 今回は、前回予告していた通り、タッチイベントについて書かせていただきます。 他所でもタッチイベントについて取り扱っていますが、当記事でのポイントは、 jQuery を使っている。（jQuery Mobile は不要です） iOS / Android で動作確認済み。 タッチできない PC の場合、マウスで動く。 この３点です。 こちらを実際に動作するコードにて解説します。 動作確認環境 タッチ環境 → iPhone / iPad / Android マウス環境 → Sleipnir / IE / Firefox / Google Chrome / Safari / Opera タッチイベントについて タッチイベントとは、スマートフォンなどで画面を直接指でタッチしたときに発生するイベントのことです。 イベントの種類 touchstart : タッチし
getComputedStyle について調べてたら深みにハマったのでメモ - IT戦記
getComputedStyle とは！？ ある要素にどんなスタイルが当たっているかを計算してくれる。便利な関数。 使いかたはめっちゃ簡単！ var style = getComputedStyle(element, ''); alert(style.fontSize); // 14px alert(style.color); // rgb(0, 0, 0) ちなみに第二引数は疑似要素の style を取りたい場合に使います。通常は空文字列でいい。 でも、 getComputedStyle はこのままでは IE, Safari では動かない。 Safari では window(グローバル領域) に getComputedStyle は定義されてなくて、 document.defaultView だけに getComputedStyle が定義されている。 ちなみに、 Firefox, Op
Window.getComputedStyle() - Web API | MDN
CSS Object ModelWindowインスタンスプロパティcachesclosedconsolecookieStorecredentiallesscrossOriginIsolatedcryptocustomElementsdevicePixelRatiodocumentdocumentPictureInPictureeventexternalfence Experimental frameElementframesfullScreenhistoryindexedDBinnerHeightinnerWidthisSecureContextlaunchQueue Experimental lengthlocalStoragelocationlocationbarmenubarmozInnerScreenXmozInnerScreenYnamenavigation Experiment
OperaとAjaxとhosts - 主にGoogleClosureTools
Opera9.62での確認なのですが、 javascriptからのhttpリクエストの際、 hostsをガン無視。 最低。 無駄な時間とられすぎ。 最悪。 うぅぅぅ（泣
JSON in JavaScript
JavaScript is a general purpose programming language that was introduced as the page scripting language for Netscape Navigator. It is still widely believed to be a subset of Java, but it is not. It is a Scheme-like language with C-like syntax and soft objects. JavaScript was standardized in the ECMAScript Language Specification, Third Edition. JSON is a subset of the object literal notatio
JavaScriptの正規表現でmatchの結果を変数に入れずにグループ化した値を取り出す - こんにちはこんにちはmonmonです！
[2008/10/29追記] 取説 正規表現を読んでみたらRegExpのプロパティはグローバル変数だから使わない方が良いのね。やっぱりいったん変数に入れよう。 - JavaScript 第5版を読んで、いつも下のようにやってた。 var str = 'abcdefghi'; var result = str.match(/^ab(.*)hi$/); if (result != null) { alert(result[1]); } いったんresultに入れて、もしマッチングしていたらグループ化したものを取り出すという感じ。 でも、下のようにマッチング結果を変数に一旦入れなくてもできる。 var str = 'abcdefghi'; if (str.match(/^ab(.*)hi$/)) { alert(RegExp.$1); } 覚書。
「Google JavaScript Style Guide」に沿ってチェックしてくれる、グーグル製JavaScript文法チェッカー
「Google JavaScript Style Guide」に沿ってチェックしてくれる、グーグル製JavaScript文法チェッカー グーグルはJavaScriptコードのスタイルガイド「Google JavaScript Style Guide」を公開しており、同社自身もこのスタイルに従って開発を行っているとされています（スタイルガイドの日本語訳の例）。 このスタイルガイドに従った開発を支援してくれるツールがグーグルからオープンソースとして公開されました。同社のClosure Tools Blogのエントリ「Introducing Closure Linter」で紹介された文法チェックツールのClosure Linterです。 Closure LinterはPythonで書かれたツールで、コマンドラインから利用します。上記のエントリによると、次のようなJavaScriptをチェックに書
jquery.cookie｜null指定でクッキー削除されないケースあり » artvecta blog
jQuery は大変便利な javascript フレームワークです。 が、今回問題に遭遇したこともあり、クッキーの削除について記載します。 例えば cookieA というクッキーに「サンプル」という文字列をセットした後、 この cookieA を削除するスクリプトを記載します。 ※ クッキーはセッションクッキー（ブラウザ終了時に削除されます） // cookieA に「サンプル」をセット。path は必要に応じて $.cookie("cookieA","サンプル",{path:"/"}); // クッキー内容を確認 alert($.cookie("cookieA")); // サンプル // クッキーにnullを代入して削除 $.cookie("cookieA",null,{path:"/"}); ネットで検索してみると「null」で削除という記事をよく目にします。
Learn More About JWP
We Enable Companies to Deliver Quality Video Experiences to Viewers Like You Learn how to deliver reliable and beautiful video experiences with all the tools, workflows, and analytics you need to make your business thrive. Enables Streaming Businesses to Deliver Live and On-Demand Video Manage, scale and monetize video (live and on-demand) easily and quickly Deliver broadcast-grade quality Launch
京ぽん用乱数クラス
京ぽん(AH-K3001V)のOperaでは、JavaScriptで乱数の生成に標準のMath.random()を使用するとOperaを起動するたびに同じ乱数列を生成してしまいます。乱数生成に使用する種が毎回同じ数値になっていると思われます。 これでは乱数としては不適切であり不便なので、乱数クラスを作成しました。 京ぽん以外でも動作しますので、乱数は本クラスを使って生成するようにするとPCでも京ぽんでも同様にランダムな乱数を利用できます。 なお、乱数のアルゴリズムはhttp://www.sm.rim.or.jp/~shishido/pie.htmlを参考にさせていただきました。 使用条件 特にありませんが、どこかにhttp://www.age.jp/~k-matsu/kyoupon/develop/randomize.htmlのを使用とか引用とか書いていただけると嬉しいです(必須ではありま
JavaScript初心者におくる24のグレイトなtips - 三等兵
私が作ったわけではなく海外の記事です。自分も学習してみました。 phpスポーツ啓発日誌や、コカトリスさんや、アイスクレアームパラダイスさんのような、品質の良い訳は私にはできませんので見出しは意訳もしくは誤訳、文章は無視して訳してません。かつ、私がいろいろコードや文章つけたしてます。内容的にはほとんどズレてはないと思いますが、適当なのでおかしいところがあるかもしれません。 うっとうしい場合は原文をどうぞ。 24 JavaScript Best Practices for Beginners 1. 等価演算子で==使うなよボケ===だろナスチン野郎 ひぃぃぃ。 ==|!= だとねー、型は自動に変換されるんすよねー。ねー。 s = '1'; i = 1; alert(s == i); // true alert(s === i); //false えーと、==は「わし、数値も文字列も中身が一緒だ
Flash コンテンツが z-index を無視して覆い被さってしまう件
えー恥ずかしながら・・・Flash について全くの素人で全然詳しくありません。 最近 Amazon から来ていたメールでお買い得ウィジェットってのを知って、面白そうなので使っていたんですけど、どうも z-index を無視して一番上に表示されてしまいます。Lightbox での画像拡大と非常に相性が悪いです。 こうなっちゃいます。 拡大表示したい画像の上に Flash が永遠とぐるぐる表示されています。こりゃ堪らんわい。Flash と z-index の関係については過去にさんざん既出なので同じような解決方法は山ほど見つかると思いますけど、自分的メモとしてエントリしました。 Flash コンテンツで z-index を有効にする方法 Flash に wmode ってパラメータがあります。このパラメータで Flash の背景を透明化または不透明化の設定が可能です。この透明化の機能を利用するこ
IE8での変化点一覧 + 備忘録 - latest log
IE8 ではかなりの数のメソッドやプロパティが増えているようです。書き残します。 element.getAttribute について追記しました。 window.toStaticHTML window.toStaticHTML は、XDomainRequest や postMessage で受け取った文字列(HTML)をサニタイズ(消毒)するメソッド。 XHRやJsonで受け取った文字列のサニタイズにもシーンを選べば使えるのだろうか。 onclick等のイベントハンドラ系を潰す。 <div onclick="alert('hoge')">hoge</div> ↓ <div>hoge</div> scriptタグを潰す。 <script>alert("hoge")</script> ↓ 無かったことになる CSS::expressionを潰す img { expression(uuClass
[JavaScript] ブラウザを判別する | Blog | Development Reference
このエントリは ライブラリ へ移動しました。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
