ズームエフェクトを作成する

Question

divにテキストを配置し、別のdivのイメージでテキストを囲み、そのイメージをMOREテキストで囲みたいとします。私はちょうど互いの上にすべてのdivを配置することを考えている、そしてそれらを順番に配置するためにz-indexを使用して、それぞれの新しいdivsを明らかにするために、show/hideを使用して、多分それらをフェードイン/しかし、テキストを含む最初のdivは、単に囲むには時間がかかりすぎます。

最初のdiv（テキストを含む）のサイズを変更する方法はありますか？おそらくonClickを使用していますか？ プレゼンテーションはそれほどセクシーになります。

私は実際にいくつかの研究をしても構わないので、これを行う明確な方法がない場合でも、誰かが正しい方向に向けることができれば、

ここにスケッチがあります。

1. は、リサイズ後のページと

2. 最終ページ1及び2のサイズを変更し、3番目のDIVを表示した後である（画像付き）は、第2のdivを示す最初のページ

3. あります（テキスト付き）

Answer 1

テキストの周りに背景があるように思えます。このために単一のイメージファイルを使用すると、テキストによって隠されているイメージの部分にかなりの帯域幅が無駄になります。上、下、左、右の境界に合わせて画像を4つの画像に分割したい場合があります。

3）の場合、テキスト内のテキスト内にテキストがあります。 HTMLをそのまま使用すると、イメージの周りにテキストを折り返す際に問題はありません。イメージ内のテキストについては、イメージを基準にしたテキストを含むdivのCSSプロパティを設定する必要があります。

jQueryは、あなたが望むものを達成するのに便利なツールです。 jQuery.cssメソッドとjQuery.widthメソッドとjQuery.heightメソッドを調べてください。これらは、コードを記述してページを必要に応じて動作させるプロセスを簡素化するツールです。