JavaScript対応ブラウザで表示してください。
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
今日もjavascriptのお話ですw

この言語、すごく融通がきき便利な反面、ブラウザによって解釈が違って挙動が変わるということもしばしばですねw

そこで、プログラミングをしていく場合には、FireFox(GEKKOエンジン)とIE(Tridentエンジン)で挙動を確認しながら進めていくわけですが、Google ChromeやSafari(どちらもWebkitエンジン)やOpera(Prestoエンジン)などでも確認しながら進めていくことが望ましいですね。
これは、javascriptに限ったことじゃなく、通常のwebページ作成にあたってもcssやhtmlの解釈が若干ことなってたりする場合がありますので、複数種類のブラウザで動作確認を行うことが望ましいのです。

ところが、ここで困ったことがあります。
どういうことかというと、統一的な開発ツールやデバッガが非常に少ない。
Eclipceプラグインスタンドアローン版が使えるJSDTとか、Adobe社が提供しているJSEclipse(これもEclipceのプラグイン)という辺りでしょうかねー。
ツールバー形式のものとかもあるようですけど、使い勝手がよくわかりません(使ってません)

ブラウザの種類も多岐にわたることから、ブラウザ依存の部分もあってなかなか難しいものがあります。

Firefoxならば、javascript開発ツールの代表格、Firebugがアドオンから入手できます。
これが他のブラウザでも使えたら言う事ないくらい使い勝手がいいです。

Google Chromeならば、javascriptコンソールが付属していて、これもけっこう使い勝手がいい。そのうえ、拡張機能の追加でFirebugが追加できるのも利点です。

困ったちゃんなのがIEなんですよね。
やっぱりMS嫌いだ!(あw
いちをIE8にもjavascriptコンソールがついてます。
F12で呼び出すことができますが、個人的な感想としては使いにくいです。
Office2003以降であれば、スクリプトエディタというのも利用できるようです。
わたしは使ってませんけどね!w

FireFoxでコードを書きIEで挙動確認。
おかしかったらChromeでデバッグして確認する感じです。
その後、他のブラウザでも動かしてみてます。

たまに手抜きで確認してないこともありますが、そんなときに限ってレイアウトがずれてたり、後からみたら挙動がおかしかったりしますw
困ったものです 。゜゜(´□`。)°゜。ワーン!!

おっと、前置きが長くなりましたが本題っと・・・

今回は、昨日の設置からのマイナーアップになります。

修正点としては、
1:動画リストのファイルを独立させる
2:複数の動画ファイルのリストを登録する
3:画面上から動画リストを選択する

色んな系統のリストを作成して登録しておき、気分で選択できるようになりました

興味のある方は、続きをどうぞw



プラグインの編集

<br>
<form name="mainForm">
<div style="text-align:center; margin:0 auto; width:200px; font-size:small;">
再生ファイル選択<br>
<select name="FL_name" onChange="selectFL();" style="width:200px;">
 <option value='0' selected>音楽PVメドレー1</option>
 <option value='1'>初音ミクPVメドレー</option>
</select><br>

リスト選曲<br>
<select name="PV_name" onChange="selectPV();" style="width:200px;"></select><br>
ランダム選曲<br>
<input type="button" value="ポチ(。・・)σ【ボタン】" onclick="randumAD();" /><br><br>
<span id='player_table'> </span><br>
</div>
</form>

ここは、基本的に表示するレイアウトを作ってるだけのことなので好みでいいんですw
後述する動画ファイルの数が増えた場合には、赤文字の部分に増えた分を追加してください。

追記
とりあえず、体裁を整えてそれっぽく見える?感じにしてみました

<form name="mainForm">
<div style="text-align:center; margin:0 auto; width:200px; height: 390px; font-size:small; background:url(画像のURL); background-repeat:repeat-y; background-position: left top; background-color: olive;">
<br><br>
ファイルリスト<br>
<select name="FL_name" onChange="selectFL();" style="width:190px;">
<option value='0' selected>邦楽PVメドレー1</option>
<option value='1'>洋楽PVメドレー1</option>
<option value='2'>初音ミクPVメドレー1</option>
</select><br>
プレイリスト<br>
<select name="PV_name" onChange="selectPV();" style="width:190px;"></select><br>
<input type="button" value="ランダム選択ボタン" onclick="randumAD();" style="width:195px;"/><br><br>
<span id='player_table'> </span>
<span id='playing_PV'> </span><br><br>
</div>
</form>

基本的に変わったのは

<div style="text-align:center; margin:0 auto; width:200px; height: 390px; font-size:small; background:url(画像のURL); background-repeat:repeat-y; background-position: left top; background-color: olive;">

この部分です。
ボタンの配置とか幅の微調整とかちょっといじりましたけど省略。
DIVタグ内のSTYLE部分のパラメータについては ここ を参考にしてみてください(他でも勿論構わないけどw)



外部設定ファイル

外部設定ファイルのサンプル3
※再生リスト表示から不要になった「-- none --」を削除したので差し替えました(2010/9/3/10:40)
動画リストのサンプル1
動画リストのサンプル2

今回は、この3ファイルをダウンロードしてください。

外部設定ファイルで編集する場所は
1:再生ファイルの選択を行う以下の部分です

// 再生ファイルの選択
function selectFL(){
・・・(前略)

// 選択したファイル番号によって読み込む動画テーブルを切り替える
if(fl1 == '0'){
 fvTB();
}else if(fl1 == '1'){
 mkTB();
}

・・・(後略)
}

動画リストを変更する場合に、この赤の太文字の部分を修正します。

動画リストのサンプル1
function fvTB(){

動画リストのサンプル2
function mkTB(){

と記述してあるのでこれに合わせて書き換えるといいでしょう。
ファイル数が3~に増えた場合には、
外部設定ファイルの

// 選択したファイル番号によって読み込む動画テーブルを切り替える
のIF文の分岐を以下のように増やしてください。

if(fl1 == '0'){
 fvTB();
}else if(fl1 == '1'){
 mkTB();
}else if(fl1 == '2'){
 3番目のファイルのFunction名();
}・・・必用な数だけ




テンプレートの編集

前回やった修正部分をそのまま利用します。
前回と違う部分は以下の部分だけです。

<script language="javascript"src="外部設定ファイルのURL" charset="euc-jp"></script>
<script language="javascript"src="動画リスト1のURL" charset="euc-jp"></script>
<script language="javascript"src="動画リスト2のURL" charset="euc-jp"></script>

<noscript>JavaScript対応ブラウザで表示してください。</noscript>
</head>
<body onload="init();">

今回はここまで。

2011/1/11 追記
β2.2になってますがほとんど変更はありません。
今回変わったのはファイルリストの部分で、以前はテーブルのインデックスを直接数値で指定してたのですが、これだとリストのメンテが非常にめんどくさいのでArray Listを作成する時に、ArrayをNewするときに 「i」と「j」の初期値をそれぞれ「0」に設定して

hit[数値]
adv[数値]

の部分を全て

hit[i++]
adv[j++]

と変更しました

これで何が変わったのか?と言うと、リストを書き込むときに数値をいちいち入力しなくてよくなり、リストの中間部分で「追加・削除」するときに、それ以降の数値を書き直す手間がかからなくなることですね
まぁ、、、「今更なにを」というような変更ですが、メンテがぐっと楽になることは確かです。
(けっこう削除されてる動画がそのままあがってるのは、上記の状況でメンテが面倒だったせいもあります)
関連記事
Relate Entry
Comment
Trackback
Comment form
検索フォーム
Google翻訳
Google supports 57 languages translation.

aguse.jpウェブ調査
カレンダー
03 | 2017/04 | 05
- - - - - - 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 - - - - - -
Lc.ツリーカテゴリー
相互リンク

※相互リンクを希望される方はリンクページのURLを添付してご連絡ください。管理人が認識できていないページに関しては対応致しかねます。

※アフィ、アダルトサイト、その他管理人が不適切と判断したページはお断りさせて頂きます。

ブロとも申請フォーム
アクセスランキング
[ジャンルランキング]
オンラインゲーム
290位
アクセスランキングを見る>>

[サブジャンルランキング]
その他
118位
アクセスランキングを見る>>

現在の閲覧者数:

2010/4/15~


Blog Widget "Revolver Maps"
2014/8/28 ~
プロフィール

ねおち

Author:ねおち

北海道帯広市出身
愛知県岡崎市在住


【略歴】
北海道帯広柏葉高等学校卒業
空手家

水商売からCocktail&PastaのBar経営を経てプログラマーへ転身
現在は年中夢求


趣味:PCいじり、読書(主に歴史関係)

錬心舘空手初段、銃剣道初段



「六月火雲飛白雪」
世の中の常識というものにとらわれてはいけない。
 『夏の雲が雪を降らせる』というほどの自由自在の考えを持つことも時には大切である。
そう思いつつなかなか出来ないねおちの日々思ってることなど。

もうちょっと詳しく見る


ねおちは蜜の味 バナー160x60

スマホ版 / 管理画面

You-Tube Randam Player









   
©TJ&SUTENEKO
2010 All Rights Reserved.

 オートスタートはしません
 Produced by ねおち

 Play File List :
 Last Modify May.28.2014
 Script File :
 Last Modify June.14.2012
 解説ページ
BMIチェッカー

 身長 cm
 体重 kg

 

 BMI -
 評価 -
 理想値 - kg
 カロリー - kcal
©TJ&SUTENEKO
2011 All Rights Reserved.
Produced by ねおち

①身長・体重を入力
②「チェック開始」ボタンを押す
③下段に結果が表示されます
解説ページ
ねおちの趣味レーター

ゲームのシミュレーターを作ってます。
計算違いとかあるかも?なのでシュミ(趣味)レーターかもしれませんが・・・orz

最近ここのエリアが大きすぎるなぁ~と思うようになってきたので別サイトに移設しました。

バナーをクリックするとページが開きます
著作権表示
Path of Exile © 2010 - 2014 Grinding Gear Games.


HAWKEN

©2013 Meteor Entertainment, Inc. All rights reserved. HAWKEN, Meteor Entertainment, Adhesive Games, and all associated logos and designs are trademarks or registered trademarks of Meteor Entertainment, Inc. All other trademarks are the property of their respective owners.


Warframe

© 2003 Digital Extremes Ltd. All rights reserved.
Warframe and the Warframe logo are trademarks of Digital Extremes Ltd.



メールフォーム

名前:
メール:
件名:
本文:



画像添付が必要な方は以下のリンク先へどうぞ
 ⇒ 画像添付用メールフォーム

PAGE TOP
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。