طراحی قالب html

itlor

Member
با سلام
ببخشید یه سوال داشتم
من میخوام یه صفحه html طراحی کنم که شکل یه تبلته که تمام منوها و آیکونها داخل صفحه تبلت قرار میگیره ولی مشکلی که دارم اینه :
میخوام وقتی روی به فرض مثال تماس با ما کلیک میکنی کل صفحه عوض نشه فقط صفحه داخل تبلت که مطالب و بقیه چیزها قرار میگیرن عوض بشن منظورم اینه که تقریبا مثل آجکس باشه یعنی صفحه تبلت تکون نخوره
هرکی میتونه کمک کنه و لطفا کامل توضیح بدید
ممنون و تشکر
:rose::clap::idea::rose:
 

sasi918

Member
سلام شما بايد از كدهاي cssاستفاده كني .بايد استايل شيت درست كني و براي هر صفحه انو رو classكني اين بهترين و راحترين كاره .
يا علي:rose:
 

itlor

Member
با سلام به شما دوست عزیز ببخشید من چون تازه کارم زیاد در این مورد بلد نیستم منظورم css میشه خیلی بیشتر توضیح بدید ممنون میشم با تشکر
 

itlor

Member
یعنی منظورت اینه که یه آی دی کلاس براش تعریف کنم و بعد از اون بیام بفرض مثال برای قسمت تماس با ما یک استایل css جدا تعریف کنم و به id که نوشتیم اتچ کنم میشه بیشتر راهنمایی کنید تو رو خدا یکی کمک کنه
 

sasi918

Member
ببخشید دیر جواب دادم یعنی اینکه باید استایل تعریف کنی.بالای قسمت body براش تعریفش کنی و بیای تو بیس وبت او رو class کنیمثلا اینجوری
HTML:
<body class="name css>"
امید وارم تونسته باشم کمکت کرده باشم یا علی
 

itlor

Member
با تشکر و سلام دوباره
میخوام این رو بپرسم یعنی یه استایل جدید کلا طراحی کنم و اونو داخل بادی تعریف کنم ؟ یا نه همون کلاس رو داخل استایل اصلی که دارم طراحی کنم. اونوقت این بیس وبت کجا هست ؟
 

websaz2012

Member
داش شما دو راه دارین
1.یک تصویر تبلت برای تگ body در css تعریف کنید.
,مطالب خود را داخل تبلت ببیند
2.این راه یک کمی پیچیده تره
شما باید دو صفحه طراحی کنید
1صفحه دقیقا مثل مثال قبل
1 صفحه دیگر که مطالبتوان داخل اون است

سپس داخل صفحه اول که تصویر تبلت پس زمینه صفحه است شما یک iframe بسازید و اونو به صفحه دوم که مطالبتونه لینک بدهید

***********************
شما باید به css مسلط باشید.

***********************
 

itlor

Member
داش شما دو راه دارین
1.یک تصویر تبلت برای تگ body در css تعریف کنید.
,مطالب خود را داخل تبلت ببیند
2.این راه یک کمی پیچیده تره
شما باید دو صفحه طراحی کنید
1صفحه دقیقا مثل مثال قبل
1 صفحه دیگر که مطالبتوان داخل اون است

سپس داخل صفحه اول که تصویر تبلت پس زمینه صفحه است شما یک iframe بسازید و اونو به صفحه دوم که مطالبتونه لینک بدهید

***********************
شما باید به css مسلط باشید.

***********************

با سلام من گزینه اولی رو انجام دادم ولی من مشکلم اینجاست که میخوام مطالب قسمت های دیگم مثل فرم تماس با ما وقتی روش کلیک بشه تبلت دوباره بارگزاری نشه و فقط مطالبی که روی صفحه تبلته عوض بشه و همه مطالب داخل صفحه داخلی تبلت جا بگیره
css و html هم ند در حد عالی ولی بلدم
 

itlor

Member
راستی این iframe فک کنم صفحه جداگانه باز کنه درسته ؟ اگه این باشه نه تقریبا چیزی که من میخوام مثل اجکسه
مثل دموی این قالب اگه نگاش کنین شاید بهتر بدونید که چی میگم
http://temphaa.com/Demo/shuffle/index.html#
 
آخرین ویرایش:

websaz2012

Member
خیر iframe یک صفحه جداگانه باز نخواهد کرد
بزارین با مثال بگم شما یک صفحه به نام home.html میسازین و تصویر زمینه ان را یک تبلت قرار میدهید
سپس یک صفحه دیگر به نام index.html میسازین و مطالب خود را درون ان قرار می دهید
حالا توی صفحه home.html
یک iframe میسازین واونو به index.html لینک میدهید.
اینجوری



[HTMLS]<iframe id="ifrm" src="index.html" width="740px" height="564"></iframe>



[/HTMLS]شما باید به ان عرض و طول نیز بدهید مانند مثال بالا
در نتیجه صفحه index.html درون صفحه home.html جایی که شما مقرر کرده اید باز
خواهد شد.
حالا بزارین ادامه دهیم ما یک صفحه دیگر به نام contact.html میسازیم
و سپس درون صفحه index.html یک لینک به ان میدهیم مثلا تماس با ما جالا اگه شما
فایل home.html را ببینید و درون همون iframe که صفحه index.html در ان لود شده بروی لینک تماس
با ما کلیک کنید. iframe همون صفحه contact.html را درون خودش باز خواهد کرد بدون
انکه یک صفحه اضافی باز کند.
به شرط انکه لینک شما از target استفاده نشده باشد.
داش اینا رو از خودم نمیگم چون من از این کارها زیاد انجام دادم و فک کنم
تجربم خیلی زیاد باشه مثلا میتونی یک نمونه کار منو این زیر ببینی.


pc.jpg
 

websaz2012

Member
حالا درمورد سوال دوم
اجاکسی کردن صفحه
دمویی که گفتین رو دیدم برای اینکه شما بتونین همچین صفحه ای بسازین
یا اینجوری بگم برای ساخت چنین صفحاتی ما فقط به یک صفحه نیاز داریم یعنی توش چند تا div id میسازیم یکی برای قسمت نمونه کارها و یک برای تماس با ما و ... سپس
یک منو میسازی مثلا توش مینویسیم تماس با ما سپس یک لینک به همون div id contact# میدهیم
سپس با کلیک بر روی تماس با ما مرورگر به قسمت تماس با ما می پرد
جالا اگه بخواهیم این کارو با اجاکس انجام دهیم احتیاج به یک پلاگین داریم که پلاگین های خیلی زیادی بصورت مجانی وجود دارد که ایفکتهای هر کدوم متفاوته
تمام این کارا رو باید برای فایل index.html انجام دهید تا صفحتون را درون tablet بصورت اجاکسی ببینید!!
 

websaz2012

Member
میتونی ازجاوا اسکریپت استفاده کنی
یه پیشنهاد واستون دارم بهتره همین قالبو واسه خودتون ریپ کنید سپس اونو تو دریمویور باز کنید و ببینید چگونه ساخته
شده است.
 
آخرین ویرایش:

itlor

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

با سلام
قالب رو دانلود کردم نگاهش کردم ولی بیشتر از جاوا و جی کوئری استفاده کرده که من هم هیچی از این دوتا سرم نمیشه
برای پلاگین اجکس میتونی بهم معرفی کنی تا در دریم ویور استفاده کنم
واقعا از راهنمایی هات ممنونم که دانشت رو رایگان در اختیار ما قرار میدی
 

websaz2012

Member
داداش توضیح دادن این بخش میتونه خیلی طولانی باشه اما من به زودی یه چیز ساده و رون برات میسازم جوری که از روش بتونی راحت اون چیزی که دوس داری بسازی
و واسه هر قسمت توضیحاتشو بهت میدم این تنها راهی است که من میتونم کامل بهت یاد بدم!!!
 

websaz2012

Member
داش اینم فایلی که برات ساختم
اگه باز هم مشکلی داشتی بگو تا با هم حلش کنیم
یا اگه جایی از کد گنگ بود و نفهمیدی بگو تا توضیح بدم!!!

دانلود فایل
 

itlor

Member
دستت درد نکنه خیلی کمک کردی واقعا ممنون و متشکرم
ولی من که قبلا گفتم که اصلا جی کوئری بلد نیستم
راستی یه سوال چهار صفحه منو رو داخل یه صفحه طراحی کردی چون داخل
نرم افزار دریم ویور بازش کردم هر چهار تا داخل یه صفحه روی هم بودن

:rose::rose::rose::rose::rose::rose::rose::rose:
 

websaz2012

Member
راستی یه سوال چهار صفحه منو رو داخل یه صفحه طراحی کردی چون داخل
نرم افزار دریم ویور بازش کردم هر چهار تا داخل یه صفحه روی هم بودن

داش بیشتر توضیح بده منظورتو نگرفتم!؟

من که اولش گفتم این حالتی که شما میخواستین باید یک صفحه طراحی کنید و اونو مثلا به همون چهار قسمت تقسیم کنی!

در ضمن احتیاجی به یاد گرفتن جیکوثری ندارید

1.شما اول jQuery.min.js را به صفحه لینک کنید

2.سپس اون کد کوچک جاوااسکریپتو که من نوشتم میتونی استفاده کنی و فقط ایدیهای خودتو به جای ایدی هایی که من نوشتم جاگذاری کن همین.

اون دمویی که هم گفتین دقیقا به همین صورتی که من ساختم ساخته شده و اگه میبینی خیلی جیکوثری توش است اون واسه کارای دیگه است ولی واسه این ایفکت
همون کد کوچک من کافیه

اگه بلد نیستی از این کد استفاده کنی باز هم بگو تا بیشتر توضیح بدم!!!
 

websaz2012

Member
راستی فک کنم منظورتو گرفتم شاید
منظورت اینه که اون ایدیهایی که من تو index.html ساختم و وقتی index.html
را تو دریمویور باز میکنی این ایدی ها رو روی هم نشون می ده؟
در حالی که باید زیر هم ردیف شده باشند

اگه منظورت اینه خوب من اونو بصورت HTML5 نوشتم اگه با Dreamweaver cs6 باز کنی مشکلی نداره چون من اونو با این ورزن ساختم!!
 

جدیدترین ارسال ها

بالا