[Solved] How to make image scrolling effect inside other image?

by


Here is what all you need.

.computer-empty {
    overflow: hidden;
    position: relative;
    width: 540px;
}
.computer-screen {
    overflow: hidden;
    position: absolute;
    height: 247px;
    width: 445px;
    left: 50px;
    top: 20px;
}
.screen-landing {
    left: 0;
    line-height: 0;
    position: absolute;
    width: 100%;
    transition: all 6s;
    -o-transition: all 6s;
    -ms-transition: all 6s;
    -moz-transition: all 6s;
    -webkit-transition: all 6s;
}
.screen-landing:hover {
    cursor: pointer;
    margin-top: -1036px;
}
img {
    max-width: 100%;
    width: auto\9;
    height: auto;
    vertical-align: middle;
    border: 0;
    -ms-interpolation-mode: bicubic;
}
.computer-empty img.computer {
    width: 100%;
}
<div class="text-align-center computer-empty">
                
                <a target="_blank" href="http://irontemplates.com/demos/redirect.php?theme=The%20Rise" class="">
                <div class="computer-screen">
                    <div class="screen-landing">
                        <img src="http://fwrd.irontemplates.com/home/img/the_rise.jpg" alt="demo - the rise">
                    </div>
                </div>
                <img class="computer" src="http://fwrd.irontemplates.com/home/img/computer.jpg" alt="computer">
                </a>
                <h1>The Rise</h1>
            </div>

0

solved How to make image scrolling effect inside other image?