rasivell

سوالي درمورد يك نوع خاص از منو ها

5 پست در این موضوع قرار دارد

سلام به دوستان گلم...

دوستان من ، من اشنايي به CSS و Html دارم ولي متاسفانه با جاوا اسكريپت كار نكردم بلد نيستم! ميخوام يه منوي بسازم به شكل منويي كه توي وسط سايت زير هست! يعني يه بخشي رو به 3 الي 4 بخش تبديل كنم كه با كليك روي اون بدون اينكه صفحه رفرش بشه ، بره توي اون بخش.! و مثلا كوئري بزارم اخرين ارسالي هاي يك دسته رو توش بياره و...

حالا منو رو بريد توي سايت زير نگاه كنيد اون وسط هستش و نوشته : اخرين نقد و برسي ها ، اخرين پيش نمايش و..

http://www.bazicenter.com/

ميخوام بدونم ميشه با CSS درش اورد؟؟ و يا نه كار ديگه اي بايد كرد!! من رو راهنمايي كنيد متشكرم

0

به اشتراک گذاری این پست


لینک به پست

سلام

این تب هست.

تب رو میتونید با css و هم با جاوااسکریپت ایجاد کنید.

یک نمونه تب (عمودی) با css

http://pterkildsen.com/2012/09/24/creating-pure-css-based-tabs/

یک نمونه تب با جی کوئری

http://broadcast.oreilly.com/2008/10/how-to-create-tabs-with-css-an.html

شما فقط باید تب رو ایجاد کنید.

نمایش پست ها در هر تب هم با کوئری وردپرس هست.

1

به اشتراک گذاری این پست


لینک به پست

متشكرم استاد.... :)

اخيش خيلي خوشحالم كه با تبه و با CSS ميشه... ببينم ميتونم از پسش بر بيام ، جون جي كوئري بلد نيستم نميدونم از كجا شروع كنم اصلا!

اقا مصطفي من اون لينكي كه براي CSS داده بوديد رو ومطالعه كردم ولي نشد كه باهاش تب بسازم ولي ارجاع داده تو ابتداي همون صفحه به يه سايت ديگه كه وقتي توش ميرم نمونه زياد داره ولي همش جي كوئري هستن كه ورداشتم ديدم روي IE جواب نميده!!! ولي ميدونم CSS خيلي بهتره و خوب جواب ميده رو همه مرور گرها!

منبع ديگه اي براي اين گونه تب ها نداريد؟ باز خودتونم نگاه كنيد متوجه ميشيد كه صفحه كاملا از سي اس اسي بودنش نگفته

0

به اشتراک گذاری این پست


لینک به پست

ايني كه شما دادي توي اينترنت اكسپلوره نمايش داده نميشه ، خودم يدونه پيدا كردم خيلي عاليه

0

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری

  • مطالب مشابه

    • توسط eh58san
      سلام روزتون بخیر استاتید محترم نیازمند پلاگین یا روشی برای ایجاد چنین منو هایی میباشم: لینک سایت  در صورتی که امکانش هست ممنون میشم راهنمایی فرمایید
       

    • توسط unid_user
      سلام و درود
      دوستان گرامی ، یه منو برای حالت موبایل ساختم که بنظرم خودم کدهاش کاملا درسته اما نمیدونم چرا وقتی روی li دوم از ul دوم هم کلیک میکنم. فرقی نمیکنه و تمام منو بسته میشه.
      لطفا ویدئو رو ببینید حتما متوجه منظورم میشید. حجم ویدئو 40 کیلوبایت هست.
      کدهای جی کوئری:
      $("span.mobile-nav-toggle").click(function() { $("nav#mobile-nav > ul").slideToggle(400); }); $("ul.mobile-nav-ul > li:has(ul)").addClass('dropdown'); $("ul.mobile-ul-1 > li:has(ul)").addClass('dropdown'); $("ul.mobile-nav-ul > li.dropdown").click(function() { $(" > ul.mobile-ul-1", this).slideToggle(400); }); $("ul.mobile-ul-1 > li.dropdown").click(function() { $(" > ul.mobile-ul-2", this).slideToggle(400); });  
      nav menu.webm
      با تشکر و سپاس
    • توسط 2raj
      سلام و عرض ادب
      جدیدا با یه مشکل روبرو شدیم و اونم عدم نمایش زیر منو ها هست.اگر در عکس دقت کنید متوجه میشید که بعد از منو خدمات مالی و حسابداری که منوی خدمات مجالس و تشریفات ،خدمات چاپ و تبلیغات،خدمات ثبت ، تاسیس و تغییر انواع شرکت و... وجود داره نمایش داده نمیشه حتی با اسکرول به پائین هم نمیتونیم اونهارو مشاهده کنیم
      حالا ممنون میشم اگر که ممکنه مشکل رو بررسی کنید و راه حلی ارائه بدید
      آدرس سایت
      سپاس

    • توسط kalantari
      فهرستی داخل سایتم ساختم
      اما زمان اجرا داخل سایت، وقتی  از روی گزینه مادر می خوام به سمت گزینه فرزند (زیر منو) حرکت کنم کلا زیر منوها ناپدید می شن و نمی تونم منو و زیر منوها رو ببینم
      ممکنه راهنماییم کنید؟
    • توسط unid_user
      سلام و درود
      دوستان گرامی یه مشکل در منوی سایت پیش اومده وقتی میرم روی منوی محصولات زیر منو چندین بار خود به خود باز و بسته میشه. کدها و ویدئو رو هم میزارم لطفا کمک کنید.
      <nav> <ul> <li> <a href="#">صفحه اصلی</a> </li> <li class="dropdown"> <a href="#">محصولات</a> <ul> <li> <a href="#">محصول یک</a> </li> <li> <a href="#">محصول دو</a> </li> <li> <a href="#">محصول سه</a> </li> <li> <a href="#">محصول چهار</a> </li> </ul> </li> <li> <a href="#">نمونه کارها</a> </li> <li> <a href="#">درباره ما</a> </li> <li> <a href="#">تماس با ما</a> </li> </ul> </nav> nav { background-color: #616161; text-align: center; border-bottom: 2px solid #333333; } nav > ul > li { display: inline-block; list-style: none; color: #fff; font-size: 12px; } nav > ul > li > a { color: #fff; display: block; padding: 10px 20px; font-size: 12px; transition: all .5s; } nav > ul > li > a:hover, li.dropdown > ul > li > a:hover { background-color: #555555; color: #deb887; } nav > ul > li > ul > li { list-style: none; text-align: right; } nav > ul > li > ul > li > a { color: #fff; } li.dropdown { position: relative; } li.dropdown > ul { position: absolute; width: 150px; background-color: #616161; right: 0px; top: 106%; border-bottom: 2px solid #333333; display: none; } li.dropdown > ul > li > a { margin: 10px auto; display: block; padding: 10px 20px; } $("li.dropdown").hover(function() { $(" > ul", this).slideDown('slow'); }, function() { $(" > ul", this).slideUp('slow'); }); با تشکر و سپاس
      Video-Sun-Dec-16-2018-22-56-36.webm