ホームページ  >  記事  >  ウェブフロントエンド  >  Webページ作成のヒント

Webページ作成のヒント

黄舟
黄舟オリジナル
2016-12-16 14:17:10913ブラウズ

1. ホームページにビデオ アニメーションを追加する
次のコードを Web ページに追加するだけで、Windows ビデオ アニメーションまたはその他の RralMedia 形式のビデオ アニメーションをホームページに追加できます。
test.avi (40M バイト)このコードでは、dynsrc の値はアニメーション ファイルの名前であり、接尾辞 avi、ra、または ram が付いているファイルである必要があり、アニメーションが自動的に再生されるように、start の値は通常「fileopen」です。 ; width と height の値は、それぞれアニメーションが再生されるときの画像の幅と高さです (ピクセルまたはパーセントで表されます)。 alt の値はアニメーション ファイルの非表示の説明です。ページの左側からの画像の距離 ( (ピクセル単位)、vspace は画像とページの上部の間の距離 (ピクセル単位) です。ここで、test.avi ファイルを目的のビデオ ファイルに変更できます。必要。

2. ハイパーリンクの色を自動的に変更します
ご存知のとおり、Web ページに動的な効果を持たせたい場合は、通常、Web ページにアニメーション画像を挿入するか、Java を使用して動的な効果をデザインする必要があります。アニメーションは多くのバイトを消費します。Java を使用して動的効果を設計するには、特定の設計基盤が必要です。以下の著者は、Web ページが動的に見えるように、ページ上のハイパーリンクの色を連続的に変更する方法を提供します。この効果を実現するには、Web ページの

と の間に次のソース コードを貼り付けるだけです。具体的なソースコードは以下の通りです:
<script Language="Javascript"> 
<! - - Begin 
function initArray( ) { 
for ( var i = 0 ; i < initArray.arguments.length; i + + ) 
{this[i] = initArray.arguments[i];} 
this.length = initArray.arguments.length; 
} 
var colors = new initArray ("red","blue","green","black","purple","blue","tan","red");delay = .5; // seconds
link = 0 ; 
vlink = 0 ; 
function linkDance ( ) { 
link= (link + 1)%colors.length; 
vlink=(vlink+1)%colors.length; 
document.linkColor = colors[link]; 
document.vlinkColor = colors[vlink]; 
setTimeout("linkDance( )",delay*1000);} 
linkDance( ); 
// End - -> 
</script>

3. ウェブページのオンライン背景画像をいつでも変更できます
私たちが普段見ているウェブページの背景画像は、一般に、ウェブページの背景パターンを自分で変更する権利を持っていません。 Web ページを作成して、訪問者が背景画像を自分で変更できるようにすることはできますか?このアイデアがある場合は、以下のコードを使用すると、そのような機能を簡単に実装できます。必要なのは、以下に提供されているソース コードをコピーして、独自の Web ページの HTML コードの適切な位置に貼り付けるだけです。とても便利とは言えませんが、うまく使えば間違いなく素晴らしいものになるでしょう。さて、まずはコードを見てみましょう。
<フォーム>
<select onChange="document.body.style.background=this.options[this.selectedIndex].value">
<option value="url('背景1のアドレス')" selected>最初の1つ背景
<option value="url('背景2のアドレス')"> 2つ目の背景
<option value="url('背景3のアドレス')"> 3つ目の背景
....他の選択形式は上記の通りです...
</selected>
</form>
このコードを使用する場合、最初に必要な背景を自分で選択または作成し、次に各背景画像の URL を置き換えることができます。上記のコードを使用すると、背景画像をランダムに簡単に変更できます。

4. 画像とブラウザウィンドウ間のシームレスな接続
Web ページに画像を挿入するとき、画像とブラウザウィンドウの境界線の間のシームレスな接続を実現するのが難しいことに気づくことがあります。ちょっと距離が不自然です。では、画像と閲覧ウィンドウとの間のシームレスな接続を実現して、画像がウィンドウの背景に自然に溶け込むようにするにはどうすればよいでしょうか?実は、挿入した画像がブラウザの境界線と隙間ができてしまうのは、ページ余白を設定していないためです。シームレスな接続を解決するには、ページソースの

タグに以下のソースコードを追加します。 code: topmargin = "0" leftmargin = "0" ここで、topmargin はブラウザ ウィンドウの上部からの距離を表し、この時点では 0 に設定されており、画像はブラウザ ウィンドウにシームレスに接続されます。 leftmargin="0" は、ブラウザ ウィンドウの左側からの距離が 0 であることを意味します。

5. 画像を表示するにはサムネイルを使用します
画像の送信速度が比較的遅いことを考慮して、Web ページに大きなサイズの画像を配置する必要がある場合は、訪問者が画像が何を表しているかをすぐに知ることができます。コンテンツについては、サムネイル表示方式を採用してもよいでしょう。つまり、元の画像を表示する前に、ブラウザがすばやく表示できるように、まず解像度が低く、サイズが小さい画像を「低ソース」として提供し、その後、元の画像を徐々に高画質または大きいサイズで表示します。 。ユーザーは、サムネイルに表示されているコンテンツが希望のものでない場合、待たずに直接他のコンテンツにアクセスできるため、閲覧効率が向上します。サムネイル表示を実現する具体的な方法は、WebページのHTMLソースファイルに以下のコードを追加します。
<img src="view.gif" lowsrc="PReview.gif" width="x" height="y" >
ここで、view.gif は元の画像、preview.gif はサムネイル、width は元の画像の幅、height は元の画像の高さです。

6. オンサイト検索エンジンを確立する
ページのコンテンツが増加し続けるにつれて、サイト内の特定のコンテンツを迅速かつ正確に取得することがますます困難になってきています。訪問者が欲しい情報をすぐに見つけられるようにするには、サイト上に検索エンジンを設置する必要があります。サイト検索エンジンを構築するには、Web サイトのネットワーク ゾーン http://netzone.swatou.com/personal/ に直接リンクし、「サイト エンジンに申請」をクリックして申請フォームに記入し、サイト ページ データベースを構築します。要求に応じ 。

7. バックグラウンド ミュージックを再生し続けます。バックグラウンド ミュージックのあるページを開くと、メロディアスな音楽が聞こえますが、マウスを使用してページ内のリンクをクリックしたり、別のページにアクセスしたりすると、メロディアスな音楽が聞こえます。を開くとBGMの再生が突然止まってしまいますが、特定のページのBGMを流し続ける方法はあるのでしょうか? 答えは「はい」です。実際に必要なのは、上部フレームと下部フレーム構造を持つ Web ページを作成し、下部フレームのページ コンテンツにサウンド ファイルを含め、下部フレームの幅を 0 ピクセルに設定し、上部フレームの幅を 0 ピクセルに設定することだけです。フレームには通常のページのコンテンツが含まれています。下のフレームはウィンドウのスペースを占有しないため、BGM を含む Web ページを離れるときに、下のフレームのページのコンテンツを配置するのと同じです。変化していない場合、サウンドは引き続き再生できます。

編集の都合上、すべてのコードの山括弧が全角になっておりますので、申請の際は半角に変更してください。

上記は Web ページ制作のヒントの内容です。その他の関連記事については、PHP 中国語 Web サイト (www.php.cn) をご覧ください。


声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。