-PR-
解決済み

litebox-1.0と同時に使いたいです。

  • すぐに回答を!
  • 質問No.3792628
  • 閲覧数115
  • ありがとう数6
  • 気になる数0
  • 回答数2
  • コメント数0

お礼率 100% (8/8)

教えての検索で見つけました、nyanko_2003様の
下記の、文字をタイプライターのように打つスクリプトなのですが
今のブログには、litebox-1.0をbodyでonload?しているせいか
そのままでは上手く動いてくれませんでした、
難しいことは解らないのですが、
実験でliteboxのスクリプトを外すとちゃんとタイプ表示出来ましたので
何か対処法があればご教授お願い致します。

<SCRIPT LANGUAGE="JavaScript">
<!---
var st = new Array();

// メッセージ設定 \nが改行です。
st[0] ="ここにメッセージ\n"+
"ここにメッセージここにメッセージ"; // 複数の場合は、st[?]の数字に0から始まる連番を。

// 文字出現のスタイルシート。
var typeStyle = "font-size:10pt; line-height:15px; color:#000000; font-weight:nomal;"; // 左から文字サイズ、行間、色、字の種類
var typeSpeed = 100; // 次の文字を表示するまでの待ち時間。1000=1秒
var tugi = "_"; // 次の文字の所に出力するキャラクター★とかにすると面白いです。
var loop = true; // ループ設定。する:true しない:false
var msgWait = 1000; // 次のメッセージを表示するまでの待ち時間。1000=1秒

_dom=(document.all?3:(document.getElementById?1:(document.layers?2:0)));

function writeTypeMsg(mes) {
if (_dom == 1) {
var div = document.getElementById("type");
while(div.hasChildNodes()) div.removeChild(div.lastChild);
var range=document.createRange();
range.selectNodeContents(div);
range.collapse(true);
var cf=range.createContextualFragment(mes);
div.appendChild(cf);
}

if (_dom == 2) {
var div = document.layers["typeN4"].layers["type"];
div.document.open();
div.document.write(mes);
div.document.close();
}

if (_dom == 3) document.all("type").innerHTML = mes;
}

charsuu=0;

if (("A".length) == 1) charsuu = 1;
else charsuu = 2;
cct = 0;
msgNo = 0;
mct = st[0].length;

function typing(){
cct += charsuu;
if (cct > mct) cct = mct;
Typeout = '<SPAN style="' + typeStyle + '">'
+ st[msgNo].substring(0,cct).replace(/\n/g, '<BR>')
+ (cct < mct ? tugi : '')
+ '</SPAN>';
writeTypeMsg(Typeout);
if (cct < mct) setTimeout('typing()', typeSpeed);
else {
msgNo = (msgNo >= st.length-1) ? 0 : msgNo + 1;
mct = st[msgNo].length; cct = 0;
if (!(!loop && msgNo == 0)) setTimeout('typing()', msgWait);
}
}

window.onload = typing;

// --->
</SCRIPT>
通報する
  • 回答数2
  • 気になる
    質問をブックマークします。
    マイページでまとめて確認できます。

質問者が選んだベストアンサー

  • 回答No.1
レベル6

ベストアンサー率 27% (3/11)

複数のスクリプトを同時使用するのは避けるべきです。

というよりか、lightbox (いまはver.2.03.3) もそうだが
平気でグローバル変数を使っている。
( var borderSize とか他のスクリプトとかぶってしまいそうな名前が普通に使われている。他のスクリプトで var borderSize が使われた瞬間にうまく動作しない可能性がでてくる。両方とも )

それに、既存の String, Array にプロパティをどんどん追加している時点で迷惑な話だ。


…まぁ同時に使用したいならまずはイベント関係を書き直すことだ。

なぜなら、window.onload = function () {...} とすると、
以前のwindow.onloadを上書きしてしまうため。
だから、lightboxが動かなくなったんだろうと思われる。

上書きしないようなプログラムが必要。

なので、まずは、イベントを追加する関数を別途作成する。
function __emiemi83_crossAddEvent( element, event, handler )
{
  if( element.attachEvent )
    element.attachEvent( 'on'+event, handler );
  else if( element.addEventListener )
    element.addEventListener( event, handler, false );
  else
  {
    var f = element['on'+event];
    element['on'+event] = function ( evt )
    {
      f( evt ); handler( evt );
    }
  }
}

一応、古いブラウザを考慮してのものだが
うまく動作するかどうかはわからないw
というか、最新のブラウザにするようページのどこかに書いておいて
最新のブラウザにしてもらうとかすればいいんじゃないかな…。
(それか他の理由があってattachEvent, addEventListenerが使えないとかいうなら別だが)
あと、関数の名前にあなたの名前をつけさせてもらったので
もしイヤだったらごめんなさい。
(あまり他のスクリプトと名前がかぶらないようにしたかった。)

んで、イベント関係の処理はすべてこの関数を使う。
たとえば window.onload = function (){...} は次のようにする
__emiemi83_crossAddEvent( window, 'load', function (){...} );

という具合。
古いブラウザを考慮しないなら
//@cc_on
window./*@if (@_jscript) attachEvent( 'on'+ @else@*/ addEventListener( /*@end@*/ 'load', function (){...}, false );
で十分なはずだ。


もっと言うと、グローバルはなくしたい。
が、lightbox.js は他のjsファイルのグローバルな変数(関数)を参照している可能性がある。
だから、lightbox, prototype, effects, scriptaclous のスクリプト全体を見直す必要があるかもしれない。多分無理だw

タイプライターのスクリプトを見直す方がいいだろう。
st
typeStyle
typeSpeed
tugi
loop
msgWait
_dom
writeTypeMsg
charsuu
cct
msgNo
mct
typing
これだけのグローバルな変数(関数)が使われている。
( 中には var 宣言がないものもある。)
まぁ簡単にグローバルをはずしたいなら
冒頭に
( function () {
そして最後に
} )();
と書いときゃ大丈夫だろw
(…あ、それだと古いブラウザだと動かないのか…?よく知らんw)
お礼コメント
emiemi83

お礼率 100% (8/8)

新しいスクリプトまで書いて頂いてありがとうございます。
名前がほとんど本名なので恥ずかしいですが・・・
lightboxも実は重いので無い方がいいのかと少し考えていましたが
これでためしてみます。
本当にありがとうございました。
投稿日時 - 2008-02-20 15:59:30

その他の回答 (全1件)

  • 回答No.2
レベル10

ベストアンサー率 66% (66/99)

ま、とりあえず動けばいいと言う事として

そのスクリプトの
window.onload = typing;



window.onload = function(){
initLightbox();
typing();
}

で大丈夫かな?・・・多分。

同じページにあれこれJavaScriptをつける時は、共存が想定がされてコーディングされてる物じゃないとかなり辛くなりますよ^^;
お礼コメント
emiemi83

お礼率 100% (8/8)

そうですよね、実はlightboxを付けた時も、
ブログのサイドバーに色々入れていたブログパーツのいくつかを
泣く泣く排除いたしました><

教えていただいてありがとうございます。
助かりました。
投稿日時 - 2008-02-20 16:02:24


このQ&Aのテーマ
このQ&Aで解決しましたか?
AIエージェント「あい」

こんにちは。AIエージェントの「あい」です。
あなたの悩みに、OKWAVE 3,500万件のQ&Aを分析して最適な回答をご提案します。

関連するQ&A
こんな書き方もあるよ!この情報は知ってる?あなたの知識を教えて!
このQ&Aにはまだコメントがありません。
あなたの思ったこと、知っていることをここにコメントしてみましょう。

その他の関連するQ&A、テーマをキーワードで探す

キーワードでQ&A、テーマを検索する
-PR-

特集


抽選で合計100名様にプレゼント!

ピックアップ

ページ先頭へ