动态换色功能

Question

https://l.facebook.com/l.php?u=https%3A%2F%2Fwww.evdemimar.com%2Foturma-odasi-renk-secimi%2F&h=AT1TiII39ztTcII0MrrwG2Ltmuyf5lL9mFdAu4Tk0vHA93EQWC--xqL_xJ9usupbW1i5_TB3cS_viBVpWTVoEXEu25DqRjr96d-iTJHqxEzCtxLOi4gXQca0Xt-bTuZ9vjsdgA

查看此网站和功能。如果单击颜色，则墙壁的颜色会动态变化。

如何执行此功能。 在此先感谢：）

Answer 1

1. 在诸如Photoshop之类的软件中剪切图像的背景，并将其另存为透明的PNG；
2. 将此图像放置在HTML div中；
3. 使用jQuery动态更改div的背景：

jQuery：

    $( '.colour-1' ).on( 'click', function() {
        $( 'div.foo').css( 'background-color', '#00CCFF' );
    } );

    $( '.colour-2' ).on( 'click', function() {
       $( 'div.the-one-that-contains-the-img').css( 'background-color', '#999999' );
    } );

HTML：

    <div class="foo">
        <img src="transparent-background-room-image.png" />
    </div>