Webページの背景画像を斜めに動かすJSメソッド_JavaScriptスキル
May 16, 2016 pm 04:13 PM
js
方法
ウェブページ
背景画像
この記事の例では、Web ページの背景画像を斜めに移動する JS の実装方法を説明します。皆さんの参考に共有してください。具体的な実装方法は以下の通りです。
コードをコピー コードは次のとおりです:
<html>
<頭>
<title>JS は Web ページの背景画像を斜めに移動する実装を行います</title>
<ボディ背景="images/changshi.ico">
<スクリプト言語="Javascript">
<!--
関数 selectAll(theField){
var tempval=eval("document." theField)
tempval.focus()
tempval.select()
}
//-->
</script>
<スクリプト言語="Javascript">
<!--
var 背景 = "images/changshi.ico";
var 速度 = 0;
ブラウザ名 = navigator.appName;
browserVer = parseInt(navigator.appVersion);
if (ブラウザ名 != "Netscape" || ブラウザバージョン >= 4.5) {
関数 moveback(movert,movedn,hPos,vPos) {
if (引数[4])
document.body.style.backgroundImage = "url("" argument[4] "")";
if (引数[5])
document.body.style.backgroundRepeat = 引数[5]
if (!isNaN(hPos)) {
if ((movert!=0) && (hPos>0)) hPos=-100000
hPos = ムーバート
}
if (!isNaN(vPos)) {
if ((movedn!=0) && (vPos>0)) vPos=-100000
vPos = 移動
}
document.body.style.backgroundPosition= hPos " " vPos
if (isNaN(hPos)) hPos = """ hPos """
if (isNaN(vPos)) vPos = """ vPos """
setTimeout("moveback(" movert "," moven "," hPos "," vPos ")",speed)
}
moveback(1,1,0,0, 背景);
}
<頭>
<title>JS は Web ページの背景画像を斜めに移動する実装を行います</title>
<ボディ背景="images/changshi.ico">
<スクリプト言語="Javascript">
<!--
関数 selectAll(theField){
var tempval=eval("document." theField)
tempval.focus()
tempval.select()
}
//-->
</script>
<スクリプト言語="Javascript">
<!--
var 背景 = "images/changshi.ico";
var 速度 = 0;
ブラウザ名 = navigator.appName;
browserVer = parseInt(navigator.appVersion);
if (ブラウザ名 != "Netscape" || ブラウザバージョン >= 4.5) {
関数 moveback(movert,movedn,hPos,vPos) {
if (引数[4])
document.body.style.backgroundImage = "url("" argument[4] "")";
if (引数[5])
document.body.style.backgroundRepeat = 引数[5]
if (!isNaN(hPos)) {
if ((movert!=0) && (hPos>0)) hPos=-100000
hPos = ムーバート
}
if (!isNaN(vPos)) {
if ((movedn!=0) && (vPos>0)) vPos=-100000
vPos = 移動
}
document.body.style.backgroundPosition= hPos " " vPos
if (isNaN(hPos)) hPos = """ hPos """
if (isNaN(vPos)) vPos = """ vPos """
setTimeout("moveback(" movert "," moven "," hPos "," vPos ")",speed)
}
moveback(1,1,0,0, 背景);
}
//-->
</スクリプト>
</body>
</html>
この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気の記事
レポ：チームメイトを復活させる方法
3週間前
By 尊渡假赌尊渡假赌尊渡假赌
スプリットフィクションを打ち負かすのにどれくらい時間がかかりますか？
3週間前
By DDD
R.E.P.O.説明されたエネルギー結晶と彼らが何をするか（黄色のクリスタル）
1週間前
By 尊渡假赌尊渡假赌尊渡假赌
ハローキティアイランドアドベンチャー：巨大な種を手に入れる方法
3週間前
By 尊渡假赌尊渡假赌尊渡假赌
人気の記事
レポ：チームメイトを復活させる方法
3週間前
By 尊渡假赌尊渡假赌尊渡假赌
スプリットフィクションを打ち負かすのにどれくらい時間がかかりますか？
3週間前
By DDD
R.E.P.O.説明されたエネルギー結晶と彼らが何をするか（黄色のクリスタル）
1週間前
By 尊渡假赌尊渡假赌尊渡假赌
ハローキティアイランドアドベンチャー：巨大な種を手に入れる方法
3週間前
By 尊渡假赌尊渡假赌尊渡假赌
ホットな記事タグ
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
Gmailメールのログイン入り口はどこですか？
7284
9
7284
9
Java チュートリアル
1622
14
1622
14
CakePHP チュートリアル
1342
46
1342
46
Laravel チュートリアル
1259
25
1259
25
PHP チュートリアル
1206
29
1206
29
EdgeブラウザのショートカットとしてWebページをデスクトップに送信するにはどうすればよいですか?
Mar 14, 2024 pm 05:22 PM
EdgeブラウザのショートカットとしてWebページをデスクトップに送信するにはどうすればよいですか?
トマト無料小説アプリで小説を書く方法. トマトノベルで小説を書く方法に関するチュートリアルを共有します。
Mar 28, 2024 pm 12:50 PM
トマト無料小説アプリで小説を書く方法. トマトノベルで小説を書く方法に関するチュートリアルを共有します。
Colorful マザーボードに BIOS を入力するにはどうすればよいですか? 2つの方法を教えます
Mar 13, 2024 pm 06:01 PM
Colorful マザーボードに BIOS を入力するにはどうすればよいですか? 2つの方法を教えます
WeChat で削除された連絡先を回復する方法 (簡単なチュートリアルでは、削除された連絡先を回復する方法について説明します)
May 01, 2024 pm 12:01 PM
WeChat で削除された連絡先を回復する方法 (簡単なチュートリアルでは、削除された連絡先を回復する方法について説明します)
すぐにマスター: Huawei 携帯電話で 2 つの WeChat アカウントを開く方法が明らかに!
Mar 23, 2024 am 10:42 AM
すぐにマスター: Huawei 携帯電話で 2 つの WeChat アカウントを開く方法が明らかに!
モバイルドラゴンの卵を孵化させる秘密が明らかに（モバイルドラゴンの卵をうまく孵化させる方法を段階的に教えます）
May 04, 2024 pm 06:01 PM
モバイルドラゴンの卵を孵化させる秘密が明らかに（モバイルドラゴンの卵をうまく孵化させる方法を段階的に教えます）
