Myspaceのプロフィール内のストレッチ背景画像
更新2011.01.23 15:37 +0100 |
Sunday March8th,2009
多くの人がMySpaceのプロフィールをカスタマイズするのに多くの時間を費やしています。 それは多くの楽しみをすることができます。 繰り返しよく寄せられる質問の一つは、プロファイル上の延伸背景画像を達成する方法です。 私はこれを少し調査し、いくつかの解決策を見つけました。 それらのどれも残念ながら完全に完璧ではありませんが、彼らはあなたのために十分に完璧かもしれません。
引き伸ばされた背景の問題はMySpaceのページに限定されないことに注意してください。 これは、すべてのwebページの一般的な問題です。 今日これには本当に良い解決策はありません（2009年春）。 CSS3background-sizeプロパティのサポートを待つ必要があります。 あなたは（あなたがMySpaceのプロファイルではない）ウェブページの完全な制御に自分自身である場合は、回避策があり、例えばを参照してくださいAbout.com.
以下のhow toの説明はすべて、MySpace Profile2.0を使用していることを前提としています。
ソリューション1: 大きな背景画像を使用する
ほとんどのモニターで背景全体を埋めるのに十分な大きさの背景画像を使用します。
メリット
- かなり簡単
デメリット
- 視聴者のモニターの大きさは決して決してないので、画像は十分に大きくないかもしれません。 あなたは1920×1200のために行く場合は、少なくとも現在の大規模なワイドスクリーンモニターをカバーします。
- もう一つの問題は、背景の特定の部分を実際に表示したいので、これらが画像の左上の領域にあることを確認することです。
- 背景画像の解像度は通常非常に大きいため、多くの一般的な画像ホスティングサイト（これにはmyspace自体やflickrなどが含まれます）ではホストできません。 そのため、解像度が大きくなる可能性のある別の場所で画像をホストする必要があります。
“画像ホスティング大きいサイズ”でGoogle検索を行い、ホスティングサイトを検索します。
- 大きな画像が許可されている画像ホスティングサイトに十分な大きさの背景画像（例えば1920×1200）をアップロードする方法。MySpaceプロファイルで
- プロファイル>カスタマイズプロファイルを有効にします。
- 外観>詳細編集>背景を有効にします。
- ホストされているイメージの場所へのUrlを入力します。http://www.yoururl.com/images/myspacebg.jpg
- Scroll with pageがNoに設定され、
- Repeatがdo not repeatに設定されていることを確認します。
- 結果を表示するには、プレビューボタンを有効にします。 満たされている場合は、公開ボタンを有効にします。
ソリューション2: 暫定的なCSS3サポート
今日のほとんどのブラウザ（2009年春）はCSS3background-sizeプロパティをサポートしていません。 彼らが引き伸ばされた背景のすべての問題を解決したならば。 しかし、webkitエンジンを使用しているほとんどのブラウザは、プロパティの予備的なサポートを持っています。 それは、例えば、ブラウザのSafariとChromeをカバーしています。
利点
- かなり簡単
- は、任意の画像サイズを使用することができます。
- 背景に適切なサイズ変更ストレッチを行います。 しかし、必ずしも超ワイドモニターに良く見えるかもしれません。
短所
- は、Internet Explorerや他の多くのブラウザでは動作しません。 これは、最も広く使用されているブラウザをカバーしているので、それは巨大な欠点です。
MySpaceプロファイルで
- プロファイルを有効にする方法>プロファイルをカスタマイズします。
- 外観を有効にする>CSS
- 次のCSSコードを入力します-urlを画像の場所に置き換えます:
- 結果を表示するには、プレビューボタンを有効にします。 満たされている場合は、公開ボタンを有効にします。
body { background-image: url(http://www.yoururl.com/images/myspacebg.jpg); x-webkit-background-size:100% 100%;}
MySpace: CSS3サイズ変更された背景でプロファイルをカスタマイズします。 クリックすると拡大表示されます。解決策3：Img要素を挿入する
最後の解決策は、HTML Img要素をプロファイルに挿入し、ブラウザウィンドウに合わせてページ上の位置を制御することです。
利点
- は、MySpaceのプロフィールアルバムからの画像など、任意の画像解像度サイズで動作します。
- 画像はページとともにスクロールし、背景が固定されないようにします。 これは大きな欠点です。
- あなたのプロフィールに紹介するのは少し複雑です。
あなたのMySpaceのプロファイルで
- プロファイルを有効にする方法>プロファイルの編集
- プロファイルの編集ページで私について有効にします。
- About Meセクションに次のHTMLコードを入力して、背景画像を参照するImg要素を挿入します。 Src属性は画像を参照する必要があります。
<img width="100%" src="http://www.yoururl.com/images/myspacebg.jpg"/>
- 変更を保存ボタンを有効にして変更を保存します。
- Activate Profile>Customize Profile
- Activate Appearance>CSS
- 次のCSSコードを入力（追加）します-基本的に、挿入された画像（識別された画像）を引き伸ばされたように背景に収まるように配置します:
- 結果を表示するには、プレビューボタンを有効にします。 満たされている場合は、公開ボタンを有効にします。
#back{ width: 100%; height: 100%; left: 0px; top: 0px; position: absolute; z-index: -1;}