SQLの窓

2014年01月25日


List of Chrome URLs( chrome://chrome-urls/ ) / Chrome の内部ページの一覧



アドレスバーに chrome://chrome-urls と入力すると、Google Chrome の内部用のページの一覧が表示されます。いくつかは、メニューから実行できるので、知っているものも多いですが、全く日本語化されていないものが多く、そもそもどう使うか全く解らないページが殆どです。

以下は、比較的ポピュラーになもの
chrome://apps
chrome://bookmarks
chrome://downloads
chrome://extensions
chrome://flags
chrome://help
chrome://history
chrome://memory
▼ 新しいタブを開く
chrome://newtab
chrome://plugins
▼ このままでは使えません
chrome://print
chrome://settings
chrome://terms
▼ 詳細なバージョン情報
chrome://version
以下は拡張機能のデバッグ用だと思います
chrome://crash


chrome://kill


chrome://hang
完全なハングアップ( ずっと返って来ません )

chrome://shorthang
少しハングアップ( このウェブページにアクセスできません』となります )

chrome://gpuclean
chrome://gpucrash
chrome://gpuhang
chrome://ppapiflashcrash
chrome://ppapiflashhang
chrome://restart/
再起動します
※ 開発版の 34.0.1803.2 canary ではもう既にいくつか増えています
chrome://chrome-signin
Chrome へのログインが WEB では無く内部に画面を設けています

chrome://quit 
デバッグ部分( 終了 )
以降は補足資料です
▼ キャッシュ削除等
chrome://settings/clearBrowserData

▼ 起動ページ設定
chrome://settings/startup

▼ ホームボタンの場所設定
chrome://settings/homePageOverlay

▼ 自動入力設定の管理
chrome://settings/autofill

▼ 保存したパスワードの管理
chrome://settings/passwords
posted by lightbox at 2014-01-25 20:32 | Google Chrome | このブログの読者になる | 更新情報をチェックする

2014年01月24日


IE の全く役に立たない『閉じたタブをもう一度開く』

そもそも、『どこなあるの?』的なもので、実は『新しいタブ』の中にあります



そして、何故『役に立たない』かと言いますと、同様の機能を Google Chrome や Firefox で実行すると、『入力したデータも復帰してくれる』からです。

そうです。IE は、そのページが表示されるだけで、他は何もしません・・・・。

関連する記事

Google Chrome の『最近閉じたタブ』ってのはこう使うのか・・・。助かった。ブログで入力していた内容を復帰してくれる!!



posted by lightbox at 2014-01-24 15:24 | IE | このブログの読者になる | 更新情報をチェックする

『3D Bouncing Ball with CSS3』のデータを使って光沢ボタンを作成する

3D Bouncing Ball with CSS3 と言う、アニメーションでバウンドしつづけるデモがあるんですが、そのボール部分のデータを取り出すと以下のようになります。






<style type="text/css">
#ball {
	width: 140px;
	height: 140px;
	border-radius: 70px;
	position: absolute;
	top: 0;	
	z-index: 11;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2JiYmJiYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk5JSIgc3RvcC1jb2xvcj0iIzc3Nzc3NyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
	box-shadow: inset 0 -5px 15px rgba(255,255,255,0.4),inset -2px -1px 40px rgba(0,0,0,0.7),0 0 1px #000;	
}
#ball::after {
	content: "";
	width: 80px; 
	height: 40px;
	position: absolute;
	left: 30px;
	top: 10px;
	z-index: 10; 
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U4ZThlOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjElIiBzdG9wLWNvbG9yPSIjZThlOGU4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
	border-radius: 40px / 20px;	
}
</style>

このデータの background 部分は、svg で書かれており、BASE64 でデコードすると、以下のようなデータになります。
<?xml version="1.0" ?>
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 1 1" preserveAspectRatio="none">
  <linearGradient id="grad-ucgg-generated" gradientUnits="userSpaceOnUse" x1="0%" y1="0%" x2="0%" y2="100%">
    <stop offset="0%" stop-color="#bbbbbb" stop-opacity="1"/>
    <stop offset="99%" stop-color="#777777" stop-opacity="1"/>
  </linearGradient>
  <rect x="0" y="0" width="1" height="1" fill="url(#grad-ucgg-generated)" />
</svg>

これを変更して色を変えて、いろいろサイズ変更すると以下のようなボタンを作成する事ができます。
( BASE64 エンコード / BASE64 デコード )
ボタン



<style type="text/css">
#btn {
	overflow:hidden;
	cursor: pointer;
	width: 140px;
	height: 50px;
	border-radius: 10px;
	position: absolute;
	top: 0;	
	left: 0;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pg0KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPg0KICA8bGluZWFyR3JhZGllbnQgaWQ9ImdyYWQtdWNnZy1nZW5lcmF0ZWQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+DQogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzU1NTU1NSIgc3RvcC1vcGFjaXR5PSIxIi8+DQogICAgPHN0b3Agb2Zmc2V0PSI5OSUiIHN0b3AtY29sb3I9IiMyMjIyMjIiIHN0b3Atb3BhY2l0eT0iMSIvPg0KICA8L2xpbmVhckdyYWRpZW50Pg0KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPg0KPC9zdmc+
);
	box-shadow: inset 0 -5px 15px rgba(255,255,255,0.4),inset -2px -1px 40px rgba(0,0,0,0.7),0 0 1px #000;	
}
#btn::after {
	content: "";
	width: 160px; 
	height: 40px;
	position: absolute;
	left: -10px;
	top: -10px;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U4ZThlOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjElIiBzdG9wLWNvbG9yPSIjZThlOGU4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
	border-radius: 40px / 20px;	
}
#btn div {
	margin-left: 20px;
	margin-top: 17px;
	font-weight: bold;
	color: #ffffff;
}
</style>
<div id="btn"><div>ボタン</div></div>

要素が position:absolute なので、コンテンツとして配置するには、position:relative 内に置く必要があります。

BASE64 部分の確認は、url() の内容を Google Chrome のアドレスバーにセットすると確認できます。

関連する記事

IE9 以降での完全な「データ URI」の利用 / WEBページにバイナリデータを埋め込む / data Protocol


posted by lightbox at 2014-01-24 00:37 | CSS3 | このブログの読者になる | 更新情報をチェックする

2014年01月23日


フリーフォントを使った背景透過PNGとCSSを使って、グラデーションな影付き吹き出しやボタンを作る。

以下の画像は、『自由の翼フォント』を使って背景を透過にして、CSS で枠線を付加しています。画像はフリーフォントで簡単ロゴ作成(横書きページ)で簡単に作成できます



この画像に CSS を適用して、以下のようにごく自然に影付きグラデーションボタンを調整する事ができます。

<style>
#img1 {
	cursor: pointer;
	background: linear-gradient(to top, #808080, #f7f7f7);
	border: solid 1px #000000;
	border-radius: 10px;
	box-shadow: 0 15px 10px -10px rgba(0,0,0,0.5), 0 1px 4px rgba(0,0,0,0.3), 0 0 40px rgba(0,0,0,0.1) inset;
}
</style>
<img id="img1" src="https://lh3.googleusercontent.com/-MCf4SV3B_EQ/UuDrJMBuhdI/AAAAAAAASOg/5hwM7wY3Tt4/s150/_img.png">
これだけでもいろいろ他にも試したくなりますが、使い勝手を増やすためにここからさらにこれを吹き出しに変更したいと思います。

その為には、さすがに画像だけでは無理なので、画像を DIV で挟んで :after と :before を使用して三角形の吹き出し口を作成します。

DIV をベースとして位置指定する為、DIV には position:relative を指定し、内部では position:absolute を指定して、上からの位置で位置調整をします。

:after 三角形は、画像の上にのって、色をグラデーションの開始色にする事によってつなぎ目を無くしています。
:before 三角形はその後ろに隠れて少し下にずれて枠線を作成しています。
<style>
#box {
	position: relative;
	height: 80px;
}

/* 下向き三角用(手前側) */
#box:after {
	content: '';
	position: absolute;
	/* border の端の特性を生かして三角を作成 */
	border-top: 16px solid #808080;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	top: 29px;	/* 増やして下へ移動 */
	left: 15px;	/* 下向き三角の左からの位置 */
}
/* 下向き三角ボーダー用(後ろ側) */
#box:before {
	content: '';
	position: absolute;
	border-top: 16px solid #000000;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	top: 31px;	/* 増やして下へ移動させて、ボーダーとして使用 */
	left: 15px;	/* :after と一致させる */
}

#img2 {
	margin: 0!important;
	cursor: pointer;
	background: linear-gradient(to top, #808080, #f7f7f7);
	border: solid 1px #000000;
	border-radius: 10px;
	box-shadow: 0 15px 10px -10px rgba(0,0,0,0.5), 0 1px 4px rgba(0,0,0,0.3), 0 0 40px rgba(0,0,0,0.1) inset;
}
</style>
<div id="box">
<img id="img2" src="https://lh3.googleusercontent.com/-MCf4SV3B_EQ/UuDrJMBuhdI/AAAAAAAASOg/5hwM7wY3Tt4/s150/_img.png">
</div>
フリーフォントで簡単ロゴ作成(横書きページ)から、リアルタイムにCSSを調整テストする事が可能です。

三角形の原理は以下のような感じです。





<style type="text/css">
#test1 {
	float: left;
	width: 0px;
	height: 0px;
	border-top:solid 100px #000000;
	border-right:solid 25px #ff0000;
	border-left:solid 25px #00ffff;
}
#test2 {
	float: left;
	width: 0px;
	height: 0px;
	border-top:solid 100px #000000;
	border-right:solid 25px #ff0000;
	border-left:solid 25px transparent;
}
#test3 {
	float: left;
	width: 0px;
	height: 0px;
	border-top:solid 100px #000000;
	border-right:solid 25px transparent;
	border-left:solid 25px transparent;
}
</style>
<div id="test1"></div>
<div id="test2"></div>
<div id="test3"></div>



posted by lightbox at 2014-01-23 22:38 | CSS3 | このブログの読者になる | 更新情報をチェックする

JavaScript : Global な undefined 変数に絡むいろいろ

undefined プロパティ

上のリンクは、Microsoft のドキュメントですが、undefined という変数が最初から定義されていて、undefined という特殊な値が入っている事を意味します。

但し、この変数は内容を変更できてしまいますので、確実な値は void( 0 ) を使います。また、ブラウザでは Global オブジェクトと window オブジェクトは同じものであるという事も以下の例で確かめる事ができます。

さらに、定義済の変数は、直接 undefined という値で比較できまかすが、未定義の値は typeof(未定義変数) == 'undefined' という比較方法になります。
<script type="text/javascript">
// テスト用の alert
function alertx(message) {
	console.log(message);
//	alert(message);
}

try {
	// 定義済なので実行可能です
	alertx("定義した未設定の変数の中身 = " + undefined);
	// 未定義なのでエラーになります
	alertx(un_defined);
}catch(e){alertx("未定義変数の参照エラー = "+e.message)}

(function(){
	// 中身を書き換える事ができます
	// ※ ローカルからグローバルにアクセスしています
	window.undefined = "undefined 変数の書き換え";
	// un_defined を定義して、undefined 値をセット
	window.un_defined = void(0);
})();

// ローカルからセットした値が有効です
alertx("undefined の内容 = "+undefined);
alertx("un_defined の内容 = "+un_defined);

var x;
if ( x === un_defined ) {
	alertx("未設定の変数の中身は、void(0)の結果と同じ(定義済の変数とは比較可能)");
}

try {
	if ( y === un_defined ) {
		alertx("if で 未定義の y を参照してエラーになり、ここは実行されません");
	}
}catch(e){alertx("未定義変数の参照エラー = "+e.message)}

if ( typeof(y) == 'undefined' ) {
	alertx("未定義変数かどうかのチェックです");
}




</script>



posted by lightbox at 2014-01-23 02:43 | JavaScript | このブログの読者になる | 更新情報をチェックする

2014年01月22日


Google Chrome デベロッパーツールの新しい 『Mobile emulation』という機能

Mobile emulation


日本語ではありませんが・・・

Google Chrome 32.0.1700.76 で正式にお目見えしました。現在、Settings の Overrides で Show 'Emulation' view in console drawer をチェックする必要がありますが、開発版の 34.0.1794.5 canary では、Overrides そのものが無くなっており、新たにレンダリング関連のタブも追加されています。


( Chrome Canary has received a number of improved mobile emulation tools which can be accessed by enabling the Emulation panel through the Settings panel. To enable: )

ぱっと見解りにくいです( 3 ) の処理

1) Device 選択
2) Emulate ボタンクリック
3) Screen 部分をクリック


( User Agent と Sensors もクリックできるようになっており、設定画面が変わります )

Emulate screen のチェックがあるかどうかで、Mobile emulation の有無が即座に切り替わって、Shrink to fit のチェックで、表示されている大きさにフィットとして縮小表示されます。

タッチスクリーンのエミュレート

この機能によって、かなりリアルにスマホの検証が可能になります。



Sensors の Emulate touch screen のチェックで動作し、カーソルがタッチ専用に変化します

前からありますが、右サイドに表示

以下のアイコンを長押しして右サイド用のアイコンを表示させてクリックします。以降は、下と右を簡単に切り替えれるようになります。








posted by lightbox at 2014-01-22 11:11 | Google Chrome | このブログの読者になる | 更新情報をチェックする

2014年01月21日


Google Chrome 32.0.1700.76 のコンボボックススクロールバーがドラッグできないのは、Windows7 のエアロ系で起きるようです。

Windows7 の個人設定で、クラシックまたは、ハイコントラストではこの問題が起きませんでした。(Windows7 ベーシックでは起こります)そこで、Windows8 で確認してみると、どのタイプでも起こりませんでした。Windows8 では、エアロを使用していないので同様に起こるかどうかは検証していませんが、とにかく Windows7 では起こる可能性が高いので、その場合は、

Windows クラシックに変更してしばらく様子を見る

というのが良いと思います


関連する記事

Google Chrome 32.0.1700.76 のコンボボックススクロールバーがドラッグできない問題が、開発版(34.0.1794.5 canary) で修正されたそうです

Google Chrome 32.0.1700.76 の具体的な問題点



posted by lightbox at 2014-01-21 10:34 | 記録 | このブログの読者になる | 更新情報をチェックする

2014年01月20日


Google Chrome 32.0.1700.76 のコンボボックススクロールバーがドラッグできない問題が、開発版(34.0.1794.5 canary) で修正されたそうです

2014/1/21
Windows7 の場合、個人設定で Windows クラシックにすると起きないようです
安定版への反映はいつなのかは解りません select要素のスクロールバーをドラッグできない (32.0.1700.76 m) ▼ 以下引用
「プルダウンのメニューがスクロールできない」という問題には、週末の間に一部修正が入りました。
恐れ入りますが、どなたか Canary (開発版)で問題がまだ起こっているかご確認いただけますか?
開発版をダウンロード(バージョン 34.0.1794.5 canary)して確認してみました。
不具合の再現はしませんでした。
以上は、Google プロダクトフォーラム 内のやりとりです。 対象となる Google 内の英文ページはこちらです (Issue 334454: No hover styling when hovering over last element in a list of <option>s) 最後の記事にこうあります
Issue is fixed on Chrome 34.0.1794.5 (Official Build 245838) canary, but able to reproduce on chrome 33.0.1750.41 (Official Build 245850).
開発版のダウンロードページは以下になります。 開発版の Google Chrome Canary は独立したアプリケーションとしてインストールされます 他の window.open で開いたウインドウ内の問題も解消されていました。 内臓 PDF ビュアーの問題も解消されていました。 デベロッパーツールの使い勝手も改善されていました 追記 いきなり 34.0.1795.2 canary に更新されました 関連する記事 Google Chrome 32.0.1700.76 の具体的な問題点
posted by lightbox at 2014-01-20 22:30 | 記録 | このブログの読者になる | 更新情報をチェックする

2014年01月16日


Google Chrome 32.0.1700.76 の具体的な問題点

開発版(34.0.1794.5 canary) では修正されています


現実としては、一つの前の 32.0.1700.72 から問題は始まっています。最新の Google Chrome のリリース情報では、『32.0.1700.76をリリースします』という内容ですが、『既知の問題』が存在しています。

▼ Google の公式リリース発表( 2014/1/14 )
Stable Channel Update

▼ 既知の問題
(1)Keyboard input is not working correctly in Windows 8 metro mode. This may impact IMEs, RTL layouts. (164964) 

(2)Trackpad users may not be able to scroll horizontally. (332797) 

(3)Drag and drop files into Chrome may not work properly. (332579) 

(4)Closing Tab by pressing the ‘x’ button may not work. (332334) 

(5)On some machines the browser UI can flicker when resizing the window. (305432) 

(6)Opening another profile using the profile icon switcher in Win8 mode results in the new window being opened on the Desktop instead of in Win8 mode. (325919) 

(7)Chrome conflicts with Norton Software including Identity Safe Toolbar. (327110) 

(8)Windows 8 mode is not yet supported on HiDPI devices and Windows 8 mode is not supported on machines without hardware acceleration (160457 and 332503). 

(9)Using Nvidia's Stereoscopic 3D feature turns Chrome pink. Users should disable this feature in Nvidia's control panel to restore normal functionality(319115). 
この内容が具体的に何を示すのか、英語力が無いので詳細は解りませんが、(4) を試す限り正常です。しかし、(3) に近いケースには遭遇していますし、(2) はコメント欄にその投稿があります。 内臓の PDF ビューアに PDF をドロップすると、開かないことが多い 何度かやっているうちに開きますし、ドロップする場所によっても違うような気がするのですが良く解りません。自分は Adobe のプラグインでえらい目にあってから、Google Chrome の内臓 Flash と 内臓 PDF ビューアのみを使用して、Adobe は全てアンインストールしています。ですから、PDF の表示は必ず Chrome の新しいタブにドロップして表示していますが、これがうまくいかなくなりました。 コンボボックスのスクロールバーのスクロールボックスをドラッグできません
2014/1/21
Windows7 の場合、個人設定で Windows クラシックにすると起きないようです
これは、32.0.1700.76 になってから気が付いたのですが、一番の実害です。スクロールバーの出ない量だといいかもしれませんが、当然量が多いとスクロールさせる必要があるのに、ドラッグする事ができません。この問題は他の場所にもあるし、(2) も似た感じがあるので、もっと根が深いかもしれません。 それと、これは『Stable Channel Update』のコメント部分で言及している人が数人おられましたが、スクロールバーの小さなスクロールを受け持つ両端のボタンが消滅しています。コンボボックスで言うと以下のように以前は存在しました。 操作上大きな支障はありませんが、スクロールバー部分に問題が多い可能性があります。 ※ 現在スクロールはマウスホイールで代替できます window.open で、スクロールバーがドラッグできないしクラッシュします コンボボックス以外でもこのような所に起きる事から、スクロールバー関連は要注意です。しかも、代替のマウスホイールでスクロールしているとしょっちゅうクラッシュが発生します。 運用した感じで言いますと、実際のクラッシュではなく、Chrome の認識がおかしいというのが実感です。 レイアウト関連が予想不能。32.0.1700.72でYahoo!の番組表がめちゃめちゃでした 現在、Yahoo!番組表は見れていますが、世の中の情報を総合すると、Yahoo!側が対応した というのが現実のようです。おそらく、世界中でそのような事が起こっていると思われるので、自分のサイトをお持ちの方は Google Chrome で閲覧確認する必要があるかもしれません。 デベロッパーツールの Emulation の場所が変更されています これはさしたる問題ではありませんが、なかなか気が付きにくい場合もあるかも知れません。そもそも、console 単独以外の場合は必ず二次コンソールが開く事が可能になっており、その中のタブに存在します。 ただ、以前の設定タブに一つだけ残っているチェックボックスによって、その新しいタブからも表示されなくなるので、しばらく探すハメになる可能性はあります。 とりあえず簡単な対処方法 インストールの仕方によって場所が変わるようですが、old_chrome.exe が 31 の場合は old_chrome.exe で急場をしのぐといいと思います。 上は、Program Files にインストールされた場合で、ユーザ単位だと C:\Users\ユーザ\AppData\Local\Google の中だと思います。 Chrome\Application のフォルダごとどこかへ保存しておくと、必要なときに起動できるようです。( 自己責任 ) ちなみに、昨日 Stable Channel Update に投稿したんですが、クレーム投稿がどんどん増えていっているようです。 CPU 負荷が増えたとか、ブックマーク管理部分でクラッシュしたとか( たぶんブックマークが多い )、ロジックのバグらしきものが散見されます。事実 window.open で開いたウインドウでクラッシしてますし( Google の Blogger なのに ) 関連する記事 Google Chrome 32 はフォームのコントロールの見栄えが軽く変わっていました
posted by lightbox at 2014-01-16 14:30 | 記録 | このブログの読者になる | 更新情報をチェックする

IE拡張 : Twitter用埋め込みコードを取得

▼ 以下からダウンロードして、解凍してエクスプローラから『install_ie_twittre_embed.wsf』を実行するとインストールされます




2014/01/16 更新
1) パラメータに lang=ja を追加して日付を日本表記にしました
( GET statuses/oembed は、古い仕様のまま存続されています )
2) アンインストールボタンを削除( Windows のセキュリティ対応 )
3) コードのテストで、クリップボードにコピーしてテストウインドウを表示するのみに変更
( IE のセキュリティ制限の対応 )
2013/01/28 更新
1) パッケージ形式変更
2) オリジナルの取得コードと同じになるように変更(オプション無し)
2013/01/01 更新
Windows7 でサーバーオブジェクトが正しく動作していませんでしたので、クライアントオブジェクトに変更しました。
× Msxml2.serverXMLHTTP
○ Msxml2.XMLHTTP
アンインストールは以下のコマンドを実行して下さい reg delete "HKCU\Software\Microsoft\Internet Explorer\MenuExt\Twitter用埋め込みコード取得" 新しいデザインでは、詳細ページから取得できますが、複数のツイートからいくつも貼り付けコードを取得したい場合は手間がかかります。しかしこれだとタイムラインからすぐ取り出せます。 古いデザイン 実行時のダイアログ コードのテストボタンは、HTMLとJavaScriptを実際に表示テストする為のページを開きます 操作 Twitter のタイムラインの日付部分で右クリックして『Twitter用埋め込みコード取得』で実行します。詳細ページでは、どこのリンクでもいいので右クリックして下さい。 以下は取得した結果を貼り付けています


タグ:twitter IE
posted by lightbox at 2014-01-16 00:34 | IE拡張メニュー | このブログの読者になる | 更新情報をチェックする
Seesaa の各ページの表示について
Seesaa の 記事がたまに全く表示されない場合があります。その場合は、設定> 詳細設定> ブログ設定 で 最新の情報に更新の『実行ボタン』で記事やアーカイブが最新にビルドされます。

Seesaa のページで、アーカイブとタグページは要注意です。タグページはコンテンツが全く無い状態になりますし、アーカイブページも歯抜けページはコンテンツが存在しないのにページが表示されてしまいます。

また、カテゴリページもそういう意味では完全ではありません。『カテゴリID-番号』というフォーマットで表示されるページですが、実際存在するより大きな番号でも表示されてしまいます。

※ インデックスページのみ、実際の記事数を超えたページを指定しても最後のページが表示されるようです

対処としては、このようなヘルプ的な情報を固定でページの最後に表示するようにするといいでしょう。具体的には、メインの記事コンテンツの下に『自由形式』を追加し、アーカイブとカテゴリページでのみ表示するように設定し、コンテンツを用意するといいと思います。


※ エキスパートモードで表示しています

アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります

<% if:page_name eq 'archive' -%>
アーカイブページでのみ表示される内容
<% /if %>

<% if:page_name eq 'category' -%>
カテゴリページでのみ表示される内容
<% /if %>

<% if:page_name eq 'tag' -%>
タグページでのみ表示される内容
<% /if %>
この記述は、以下の場所で使用します


Windows
container 終わり

フリーフォントで簡単ロゴ作成
フリーフォントでボタン素材作成
フリーフォントで吹き出し画像作成
フリーフォントではんこ画像作成
ほぼ自由に利用できるフリーフォント
フリーフォントの書体見本とサンプル
画像を大きく見る為のウインドウを開くボタンの作成

Android SDK ポケットリファレンス
改訂版 Webデザイナーのための jQuery入門
今すぐ使えるかんたん ホームページ HTML&CSS入門
CSS ドロップシャドウの参考デモ
PHP正規表現チェッカー
Google Hosted Libraries
cdnjs
BUTTONS (CSS でボタン)
イラストAC
ぱくたそ
写真素材 足成
フリーフォント一覧
utf8 文字ツール
右サイド 終わり
base 終わり