HTML - 拡大/縮小画像/ウェブページ全体を埋める色

Question

この場合、fiddleについては、a hrefをクリックすると、画像が拡大/拡大していっぱいになりますページは、それが置かれているdivから始まるトランジション/スケーリングを持つ。これが不可能な場合は、画像が入っているdivの背景色で、画像を含むdivから始まる色のトランジション/塗りつぶしでページを埋めたいと思います。

スケーリング、トランスフォーム、オーバーレイを適用しようとしましたが、正しく適用できませんでした。したがって、ここで助けを要求してください。この例のコードには、私が試したトランジションはありません。とにかく動作します。

私は可能な限り私の想像力を言葉に置きました。これが明白でない場合&誰でも助けてくれると思いますが、お気軽に質問してください。

Answer 1

イメージがピクセル化され、ブラウザのパフォーマンスが低下するため、イメージをHTML本文全体に拡大しないでください。ここで

は、Webページの色を埋めるために私のソリューションです：

$('.circleDiv').on('mouseenter', 'a', function() { 
    $('body').animate({ 
    backgroundColor: "#09f" 
    }, 1000); 
}); 

See Demo Here