PDA

View Full Version : سوال: کمک برای طراحی یک بخش از سایت



mahsa-k
چهارشنبه 08 مهر 1394, 13:17 عصر
با سلام خدمت همه ی دوستان
من می خواهم بخشی از صفحه لینک زیر را طراحی کنم که کیفیت Full HD و 4K را مقایسه می کند، تا حدی هم طراحی کردم فقط اون بخشی که در سایت اصلی شناور است را نمی توانم درست کنم، لطفا راهنماییم کنید، خیلی فوری هست:ناراحت:
لینک سایت اصلی : http://panasonic.net/prodisplays/solutions/technology/4K/index.html
کد های من :

<div style="box-sizing:border-box; color: #333; font-size:100%; font-weight:normal; line-height:100%; margin:0; padding:0;">
<div style="background: rgba(0, 0, 0, 0) url(http://panasonic.net/prodisplays/solutions/technology/4K/img/whats_bg01.jpg) repeat scroll 0 0; padding: 50px 0;">
<div style="margin: 0 auto; position: relative; width: 967px;">
<div style="overflow: hidden; position: relative; width: 967px; height: 544px;">
<div style="overflow: hidden; position: absolute; width: 483.5px; height: 544px; z-index: 2;">
<img width="967" height="544" alt="" src="http://panasonic.net/prodisplays/solutions/technology/4K/img/whats_img03.jpg" />
</div>
<div style="overflow: hidden; position: absolute; z-index: 1;">
<img width="967" height="544" alt="" src="http://panasonic.net/prodisplays/solutions/technology/4K/img/whats_img04.jpg" />
</div>
<p></p>
<div style="height: 100%; width: 1px; position: absolute; z-index: 3; left: 482.5px; top: 0px; cursor: ew-resize;">
<span style="background-image: url(http://panasonic.net/prodisplays/solutions/technology/4K/img/whats_bar.png); background-repeat: no-repeat; position: absolute; background-position: 0 0; height: 544px; overflow: hidden; width: 55px; left: -27px; top: 0px;"></span>
</div>
</div>
</div>
<p class="att">Drag your mouse to move from Full-HD to 4K</p>
<p>
High-volume data is also sharp and crisp.
<br />
Images are displayed on a single screen, so the data is not split up and viewers can concentrate on the screen image.
</p>
</div>
</div>

Mr.Robot666
پنج شنبه 09 مهر 1394, 10:04 صبح
اون سکشن با بکگراند خاکستری رو میگید؟ دو تصویر روی همه که با استفاده از جاوا اسکریپت اسکرول میکنه و مقدار clip توی css رو تغییر میده http://www.w3schools.com/cssref/pr_pos_clip.asp
من حدس میزنم، مطمئن نیستم بهتره جستجو کنید ویا از متخصص کمک بگیرید شاید پلاگین آمادش رو پیدا کردید