AliExpress Flash Sale
by iSiddharthGiri
HTML
<script src="http://up.hkbot.io/f/aotik/scroll.js"></script>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://css-tricks.com/examples/HorzScrolling/jquery.mousewheel.js"></script>
<div id="DIV_1">
<div id="DIV_2">
<a href="http://bit.ly/2PNE7mA" target="_blank" rel="nofollow noopener" id="A_3"> <span id="SPAN_4">Flash Deals</span></a>
</div>
<div id="DIV_6">
<div id="DIV_12">
<a href="http://bit.ly/2PNE7mA" target="_blank" rel="nofollow noopener" id="A_13">
<div id="DIV_14">
<amp id="AMP-IMG_15">
<img alt="Xiaomi Mi A2 — Global Version" src="//ae01.alicdn.com/kf/HTB1h._FHQOWBuNjSsppq6xPgpXan.jpg_200x200.jpg" id="IMG_16" />
</amp>
</div>
<div id="DIV_17">
<span id="SPAN_18">US $209.99</span> <del id="DEL_19">US $279.99</del>
</div>
</a>
</div>
<div id="DIV_20">
<a href="http://bit.ly/2PNE7mA" target="_blank" rel="nofollow noopener" id="A_21">
<div id="DIV_22">
<amp id="AMP-IMG_23">
<img alt="OUKITEL K7 with 10000 mAh Battery" src="//ae01.alicdn.com/kf/HTB1t2HgysyYBuNkSnfoq6AWgVXap.jpg_350x350.jpg" id="IMG_24" />
</amp>
</div>
<div id="DIV_25">
<span id="SPAN_26">US $164.99</span> <del id="DEL_27">US $249.99</del>
</div>
</a>
</div>
<div id="DIV_28">
<a href="http://bit.ly/2PNE7mA" target="_blank" rel="nofollow noopener" id="A_29">
<div id="DIV_30">
<amp id="AMP-IMG_31">
<img alt="Xiaomi Redmi Note 5 — Global Version" src="//ae01.alicdn.com/kf/HTB126KczsuYBuNkSmRyq6AA3pXao.jpg_350x350.jpg" id="IMG_32" />
</amp>
</div>
<div id="DIV_33">
<span id="SPAN_34">US $179.79</span> <del id="DEL_35">US $239.72</del>
</div>
</a>
</div>
<div id="DIV_36">
<a href="http://bit.ly/2PNE7mA" target="_blank" rel="nofollow noopener" id="A_37">
<div...
CSS
#DIV_1 {
box-sizing: border-box;
color: rgb(58, 62, 74);
height: 381.15px;
text-decoration: none solid rgb(58, 62, 74);
text-size-adjust: 100%;
width: 790.4px;
column-rule-color: rgb(58, 62, 74);
perspective-origin: 395.2px 190.575px;
transform-origin: 395.2px 190.575px;
caret-color: rgb(58, 62, 74);
border: 0px none rgb(58, 62, 74);
font: normal normal 400 normal 0px / 0px Roboto, "Open Sans", Helvetica, Arial;
margin: 0px 0px 12px;
outline: rgb(58, 62, 74) none 0px;
}/*#DIV_1*/
#DIV_1 a {text-decoration: none;}
#DIV_2 {
box-sizing: border-box;
color: rgb(58, 62, 74);
height: 50.2px;
text-decoration: none solid rgb(58, 62, 74);
text-size-adjust: 100%;
width: 790.4px;
column-rule-color: rgb(58, 62, 74);
perspective-origin: 395.2px 25.1px;
transform-origin: 395.2px 25.1px;
caret-color: rgb(58, 62, 74);
border: 0px none rgb(58, 62, 74);
font: normal normal 400 normal 0px / 0px Roboto, "Open Sans", Helvetica, Arial;
outline: rgb(58, 62, 74) none 0px;
overflow: hidden;
padding: 15px 8px 12px;
}/*#DIV_2*/
#A_3 {
box-sizing: border-box;
color: rgb(58, 62, 74);
text-decoration: none solid rgb(58, 62, 74);
text-size-adjust: 100%;
width: 100%;
column-rule-color: rgb(58, 62, 74);
perspective-origin: 0px 0px;
transform-origin: 0px 0px;
caret-color: rgb(58, 62, 74);
border: 0px none rgb(58, 62, 74);
font: normal normal 400 normal 0px / 0px Roboto, "Open Sans", Helvetica, Arial;
outline: rgb(58, 62, 74) none 0px;
}/*#A_3*/
#SPAN_4 {
box-sizing: border-box;
color: #0e65f1;
cursor: pointer;
display: block;
float: left;
height: 23.2px;
text-decoration: none solid rgba(0, 0, 0, 0.87);
text-size-adjust: 100%;
width: auto;
column-rule-color: rgba(0, 0, 0, 0.87);
perspective-origin: 309.75px 11.6px;
transform-origin: 309.75px 11.6px;
caret-color: rgba(0, 0, 0,...
JavaScript
$('#DIV_6 #DIV_12').click( function() {
$('#DIV_6 #DIV_12').removeClass('selected');
$(this).addClass('selected');
});
$(document).ready(function () {
$('#DIV_6').mousewheel(function(e, delta) {
this.scrollLeft -= (delta * 40);
e.preventDefault();
});
});