رفتن به مطلب

درخواست افزونه برای قراردادن بنر بهمراه متن قابل انتخاب!


پست های پیشنهاد شده

سلام دوستان،

لطفاً نگاهی به صفحه جالب پیش فروش ال جی در آدرس زیر بندازین و با توجه به ویژگی قرار دادن متن قابل انتخاب، و حتی لینک، و بخش بلند قابل اسکرول روی این تصویر بفرمایید که چطور میتونم چنین تصویری رو روی وبسایتم داشته باشم؟ (با افزونه یا هر روش دیگری)

http://www.lg.com/ir/g4preorder

پیشاپیش سپاسگزارم.

ویرایش شده توسط Ahmad.g
لینک به ارسال

سلام ،

کافیه به اون بخش از سایت از طریق سی اس اس یه پس زمینه بدید به شکل زیر:


selector{ background: url(addresse aks);

یه نمونه ساده:

<div class="lgg4_overview_hero">

<div class="lg-title">

LG G4

<span>این جشنواره مختص علاقه مندان به گوشی ال جی G4 بوده و دارای دو بخش آنلاین و حضوری می باشد.</span>

</div>

<div class="scrollbox"><div id="mCSB_1" class="mCustomScrollBox mCS-dark-3 mCSB_vertical mCSB_inside" tabindex="0"><div id="mCSB_1_container" class="mCSB_container" style="position: relative; top: -200px; left: 0px;" dir="rtl">

<h4>نحوه شرکت در بخش آنلاین جشنواره</h4>

<ol>

<li dir="RTL">علاقه مندان به پیش خرید گوشی ال جی  G4 می توانند از تاریخ 11 خردادماه 1394 لغایت 26 خردادماه 1394 با مراجعه به وبسایت ال جی  G4  به آدرس <a href="http://www.lg.com/ir/g4preorder">www.lg.com/ir/g4preorder</a> جهت پیش خرید گوشی ال جی  G4 ثبت نام نمایند.</li>

<li dir="RTL">در تاریخ 27 خردادماه 1394 قرعه کشی در بین تمامی ثبت نام کنندگان انجام گرفته و به برندگان جوایزی به ترتیب ذیل تعلق خواهد گرفت.

<ul>

<li dir="RTL">کارت هدیه نقدی به ارزش 20,000,000 ریال برای 44 نفر.</li>

<li dir="RTL">کارت هدیه نقدی به ارزش 8,000,000 ریال برای 444 نفر.</li>

</ul>

</li>

<li dir="RTL">برندگان بخش آنلاین تا 31 تیرماه 1394 فرصت خواهند داشت تا  یک گوشی G4 با گارانتی دو ساله ال جی خریداری کرده و عکس مدارک ذیل را توسط ایمیل ثبت نام در قرعه کشی خود به آدرس ایمیل <a href="mailto:444event@kavoshgrp.com">444event@kavoshgrp.com</a> ارسال نمایند.

<ul>

<li dir="RTL">عکس کارت طلایی گارانتی دو ساله ال جی.</li>

<li dir="RTL">عکس جعبه گوشی  از قسمت IMEI وشماره سریال.</li>

<li dir="RTL">عکس گوشی G4 به همراه جعبه.</li>

<li dir="RTL">عکس واضح از فاکتور خرید.</li>

</ul>

جوایز پس از بررسی مدارک توسط تیم ال جی برای برندگان توسط پست ارسال خواهد شد.

</li>

<li>اسامی برندگان بخش آنلاین جشنواره در تاریخ 30 خرداد 94 بصورت آنلاین در سایت <a href="http://www.lg.com/ir/g4preorder">www.lg.com/ir/g4preorder</a> اعلام میشود وبصورت تلفنی نیز اطلاع رسانی خواهد  شد .</li>

</ol>

<h4>نحوه شرکت در بخش حضوری جشنواره</h4>

<ol>

<li dir="RTL">از علاقه مندان به گوشی ال جی G4 دعوت می گردد تا در روز سه شنبه مورخ 26 خردادماه 1394 از ساعت 10 صبح لغایت 3 بعد از ظهر به طبقه همکف بازار چهارسو (غرفه ال جی) مراجعه کرده و کارت شرکت در قرعه کشی دریافت نمایند

(به تعداد محدود).

<br>

آدرس بازار چهارسو: تهران خیابان جمهوری تقاطع حافظ ضلع جنوب شرقی.

</li>

<li dir="RTL">قرعه کشی در همان روز راس ساعت 5 بعد از ظهر در حضور شرکت کنندگان انجام خواهد شد و به برندگان جوایز زیر تعلق خواهد گرفت.

<ul>

<li dir="RTL">44 عدد گوشی ال جی جی 4 برای 44 نفر بصورت رایگان</li>

<li dir="RTL">44 عدد گوشی ال جی جی 4 برای 44 نفربا 44% تخفیف</li>

<li dir="RTL">444 عدد گوشی ال جی جی 4 برای 444 نفر با 10% تخفیف</li>

</ul>

جهت دریافت تخفیفات ذکر شده برندگان باید در همان روز از فروشگاه گلدیران چهارسو گوشی G4 خریداری نمایند.

</li>

</ol>

</div><div id="mCSB_1_scrollbar_vertical" class="mCSB_scrollTools mCSB_1_scrollbar mCS-dark-3 mCSB_scrollTools_vertical" style="display: block;"><a href="#" class="mCSB_buttonUp" oncontextmenu="return false;" style="display: block;"></a><div class="mCSB_draggerContainer"><div id="mCSB_1_dragger_vertical" class="mCSB_dragger" style="position: absolute; min-height: 30px; display: block; height: 84px; max-height: 200px; top: 68px;" oncontextmenu="return false;"><div class="mCSB_dragger_bar" style="line-height: 30px;"></div></div><div class="mCSB_draggerRail"></div></div><a href="#" class="mCSB_buttonDown" oncontextmenu="return false;" style="display: block;"></a></div></div></div>

</div>

<style>

.lgg4_overview_hero { background: url('http://g4.lgemobile.ir/images/hero_home.jpg') no-repeat; background-size:cover;min-height:533px;}

.lg-title{position:absolute;margin:50px 0px 0 150px;font-size:80px; color:#562011;}

.lg-title span{font-size:20px; display:block; max-width:300px;}

.scrollbox{

width:200px;

height:250px;

overflow:scroll;

overflow-x:hidden;

position:absolute;

left:200px;

top:250px;

color:#fff;

border:solid #000 2px;

}

البتّه این صفحه به وسیله جاوا اسکریپت نوشته شده که در کد بالا بهش توجّه نشده و یه نمونه پایه در نظر گرفته شده فقط

نتیجه کد بالا رو میتونید در آدرس زیر ببینید و تغییرات مدّ نظرتون رو بهش بدید:

http://onlinehtmltools.com/live-html-editor/editor.html

نمونه های زیادی از صفحات تک صفحه ای توی اینترنت هست که اگر جستجو کنید میتونید پیداشون کنید.

موفّق باشید.

لینک به ارسال

سلام ،

کافیه به اون بخش از سایت از طریق سی اس اس یه پس زمینه بدید به شکل زیر:


selector{ background: url(addresse aks);

یه نمونه ساده:

<div class="lgg4_overview_hero">

<div class="lg-title">

LG G4

<span>این جشنواره مختص علاقه مندان به گوشی ال جی G4 بوده و دارای دو بخش آنلاین و حضوری می باشد.</span>

</div>

<div class="scrollbox"><div id="mCSB_1" class="mCustomScrollBox mCS-dark-3 mCSB_vertical mCSB_inside" tabindex="0"><div id="mCSB_1_container" class="mCSB_container" style="position: relative; top: -200px; left: 0px;" dir="rtl">

<h4>نحوه شرکت در بخش آنلاین جشنواره</h4>

<ol>

<li dir="RTL">علاقه مندان به پیش خرید گوشی ال جی  G4 می توانند از تاریخ 11 خردادماه 1394 لغایت 26 خردادماه 1394 با مراجعه به وبسایت ال جی  G4  به آدرس <a href="http://www.lg.com/ir/g4preorder">www.lg.com/ir/g4preorder</a> جهت پیش خرید گوشی ال جی  G4 ثبت نام نمایند.</li>

<li dir="RTL">در تاریخ 27 خردادماه 1394 قرعه کشی در بین تمامی ثبت نام کنندگان انجام گرفته و به برندگان جوایزی به ترتیب ذیل تعلق خواهد گرفت.

<ul>

<li dir="RTL">کارت هدیه نقدی به ارزش 20,000,000 ریال برای 44 نفر.</li>

<li dir="RTL">کارت هدیه نقدی به ارزش 8,000,000 ریال برای 444 نفر.</li>

</ul>

</li>

<li dir="RTL">برندگان بخش آنلاین تا 31 تیرماه 1394 فرصت خواهند داشت تا  یک گوشی G4 با گارانتی دو ساله ال جی خریداری کرده و عکس مدارک ذیل را توسط ایمیل ثبت نام در قرعه کشی خود به آدرس ایمیل <a href="mailto:444event@kavoshgrp.com">444event@kavoshgrp.com</a> ارسال نمایند.

<ul>

<li dir="RTL">عکس کارت طلایی گارانتی دو ساله ال جی.</li>

<li dir="RTL">عکس جعبه گوشی  از قسمت IMEI وشماره سریال.</li>

<li dir="RTL">عکس گوشی G4 به همراه جعبه.</li>

<li dir="RTL">عکس واضح از فاکتور خرید.</li>

</ul>

جوایز پس از بررسی مدارک توسط تیم ال جی برای برندگان توسط پست ارسال خواهد شد.

</li>

<li>اسامی برندگان بخش آنلاین جشنواره در تاریخ 30 خرداد 94 بصورت آنلاین در سایت <a href="http://www.lg.com/ir/g4preorder">www.lg.com/ir/g4preorder</a> اعلام میشود وبصورت تلفنی نیز اطلاع رسانی خواهد  شد .</li>

</ol>

<h4>نحوه شرکت در بخش حضوری جشنواره</h4>

<ol>

<li dir="RTL">از علاقه مندان به گوشی ال جی G4 دعوت می گردد تا در روز سه شنبه مورخ 26 خردادماه 1394 از ساعت 10 صبح لغایت 3 بعد از ظهر به طبقه همکف بازار چهارسو (غرفه ال جی) مراجعه کرده و کارت شرکت در قرعه کشی دریافت نمایند

(به تعداد محدود).

<br>

آدرس بازار چهارسو: تهران خیابان جمهوری تقاطع حافظ ضلع جنوب شرقی.

</li>

<li dir="RTL">قرعه کشی در همان روز راس ساعت 5 بعد از ظهر در حضور شرکت کنندگان انجام خواهد شد و به برندگان جوایز زیر تعلق خواهد گرفت.

<ul>

<li dir="RTL">44 عدد گوشی ال جی جی 4 برای 44 نفر بصورت رایگان</li>

<li dir="RTL">44 عدد گوشی ال جی جی 4 برای 44 نفربا 44% تخفیف</li>

<li dir="RTL">444 عدد گوشی ال جی جی 4 برای 444 نفر با 10% تخفیف</li>

</ul>

جهت دریافت تخفیفات ذکر شده برندگان باید در همان روز از فروشگاه گلدیران چهارسو گوشی G4 خریداری نمایند.

</li>

</ol>

</div><div id="mCSB_1_scrollbar_vertical" class="mCSB_scrollTools mCSB_1_scrollbar mCS-dark-3 mCSB_scrollTools_vertical" style="display: block;"><a href="#" class="mCSB_buttonUp" oncontextmenu="return false;" style="display: block;"></a><div class="mCSB_draggerContainer"><div id="mCSB_1_dragger_vertical" class="mCSB_dragger" style="position: absolute; min-height: 30px; display: block; height: 84px; max-height: 200px; top: 68px;" oncontextmenu="return false;"><div class="mCSB_dragger_bar" style="line-height: 30px;"></div></div><div class="mCSB_draggerRail"></div></div><a href="#" class="mCSB_buttonDown" oncontextmenu="return false;" style="display: block;"></a></div></div></div>

</div>

<style>

.lgg4_overview_hero { background: url('http://g4.lgemobile.ir/images/hero_home.jpg') no-repeat; background-size:cover;min-height:533px;}

.lg-title{position:absolute;margin:50px 0px 0 150px;font-size:80px; color:#562011;}

.lg-title span{font-size:20px; display:block; max-width:300px;}

.scrollbox{

width:200px;

height:250px;

overflow:scroll;

overflow-x:hidden;

position:absolute;

left:200px;

top:250px;

color:#fff;

border:solid #000 2px;

}

البتّه این صفحه به وسیله جاوا اسکریپت نوشته شده که در کد بالا بهش توجّه نشده و یه نمونه پایه در نظر گرفته شده فقط

نتیجه کد بالا رو میتونید در آدرس زیر ببینید و تغییرات مدّ نظرتون رو بهش بدید:

http://onlinehtmltoo...tor/editor.html

نمونه های زیادی از صفحات تک صفحه ای توی اینترنت هست که اگر جستجو کنید میتونید پیداشون کنید.

موفّق باشید.

سپاس دوست عزیز بابت پاسخ کاملتون...

ظاهراً با کمی تأمل میشه براحتی کار تمیز و مشابهی رو طراحی کرد!

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...