• اطلاعیه ها

    • Morteza

      باهم بسازیم: اطلس ووکامرس و وردپرس   14/07/96

      تاپیک ایجاد شده برای بحث در جهت ایجاد یک منبع، ویکی، صفحات توضیحی و یا بخش آموزشی جامع برای وردپرس و متعلقات مختلف آن است. لطفا جهت مشارکت در این بحث، ارائه پیشنهاد و یا انتقاد به تاپیک فوق مراجعه کنید. باهم بسازیم: اطلس ووکامرس و وردپرس
soheilyou

تفکیک کردن خروجی wp_nav_menu و اختصاص class و id به قسمت های مختلف برای ساخت منوی آبشاری

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

من میخوام یه منوی آبشاری واسه خودم درست کنم با css و jquery

اساسش رو که تو یه فایل html ساده درست کردم به طوری که وقتی موس روی یه div میره juery یه div رو که مخفی بوده رو slidedown میکنه ! با این کد ها :

Html :


<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="style.css" >
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script>
<!--------------------------------------------------------------------------------->
<script>
$(document).ready(function(){

$(".mother").mouseenter(function(){
$("#child").slideToggle("fast");
});

$(".mother").mouseleave(function(){

$("#child").slideUp("fast");
});

$(".child").mouseleave(function(){
$("#child").slideUp("fast");
});


});
</script>
</head>
<body>

<div class="mother" id="mother">
<div id="menuspace">slider </div>
<div class="child" id="child">slider </div>
</div>
</body>
</html>

css:


#mother{


width:300px;
height:100px;
background-color:#F93;
border: 1px solid black;
margin-bottom:4px;
}
#child{


width:300px;
height:200px;
background-color: #F3C;
border: 1px solid #6CF;
margin-bottom:4px;
display:none;
position:relative;

}
#menuspace
{
height:104px;}

الان من میخوام همین مبنای منو های خودم باشه ولی مشکلی که دارم اینه که من برای محتویات منو از کد :


<?php wp_nav_menu( array( 'theme_location' => 'top-menu', 'container' =>'nav', 'menu_class' =>'topnav' ) ); ?>

استفاده میکنم و یه خروجی میده با یه سری nav و ul و li که میشه بهشون استایل داد ولی فقط با آدرس دادن نسبی مثلا اینجوری :


nav > ul > li > a {
font-family:BYekan, Tahoma, Geneva, sans-serif;
padding: 10px 20px;
}

منظورم اینه که مثلا برای یه دونه از دسته های خاص نمیشه کلاس یا آدی متمایز اختصاص داد !

اگه بتونم اینکار رو بکنم متونم دونه دونه از قسمت های خروجی رو با کلاس های متمایز جدا کنم و اونوقت مشخص کنم که مثلا وقتی موس رو div با Id="mother" رفت div با id="child" رو slidedown کنه !

37260896776279840422.jpg

post-4921-0-98194800-1391700877_thumb.jp

0

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط masoudmosleh267
      سلام دوستان. من سایتم سرعتش خیلی پایینه. wp rocket رو نصب کردم خیلی بهتر شد اما بخش فشرده کردن css , js رو فعال کردم قالب رو به هم ریخت و مجبور شدم این بخش رو غیر فعال کنم. قالب رو اورجینال از تم فارست خریدم. الان مشکل چیه؟ چطوری میشه فایل هایی که gtmetrix بم میگه رو gzip کنم؟
      به پشتیبانی سایتمم گفتم ارور 504 رو زیاد میده گفت کدنویسی سایتت رو بهینه کن یا هاست ویژه یا اختصاصی بخر. مصرف منابع ات بالاست.

    • توسط farzadnoruzi
      سلام.
      دوستان من قالب zerif-lite رو روش کار کردم و کلی تغییرات دادم ولی بیشتر روی css ها کار کردم. الان منو واکنش گراش کار نمیکنه . لطفا بررسی کنید و راهنمایی کنید که مشکل از چیه
      منو باز نمیشه . البته باز میشه و خودکار بسته میشه . ثابت نمیمونه ... لطفا راهنمایییییی
      http://new.hofmannprofile.com
    • توسط alibashiri
      سلام دوستان
      لطفا در مورد آبشاری کردن این قالب کمک کنید
      برنامه هدر اینه
      <?php
      /**
       * The Header for our theme.
       * Displays all of the <head> section and everything up till <div id="content">
       */
      ?><!DOCTYPE html>
      <html <?php language_attributes(); ?>>
      <head>
      <?php zerif_top_head_trigger(); ?>
      <meta charset="<?php bloginfo( 'charset' ); ?>">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="profile" href="http://gmpg.org/xfn/11">
      <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
      <?php wp_head(); ?>
      <?php zerif_bottom_head_trigger(); ?>
      </head>
      <?php if(isset($_POST['scrollPosition'])): ?>
          <body <?php body_class(); ?> onLoad="window.scrollTo(0,<?php echo intval($_POST['scrollPosition']); ?>)">
      <?php else: ?>
          <body <?php body_class(); ?> >
      <?php endif;
          zerif_top_body_trigger();
          
          /* Preloader */
          if(is_front_page() && !is_customize_preview() && get_option( 'show_on_front' ) != 'page' ):
       
              $zerif_disable_preloader = get_theme_mod('zerif_disable_preloader');
              
              if( isset($zerif_disable_preloader) && ($zerif_disable_preloader != 1)):
                  echo '<div class="preloader">';
                      echo '<div class="status">&nbsp;</div>';
                  echo '</div>';
              endif;    
          endif; ?>

      <div id="mobilebgfix">
          <div class="mobile-bg-fix-img-wrap">
              <div class="mobile-bg-fix-img"></div>
          </div>
          <div class="mobile-bg-fix-whole-site">

      <header id="home" class="header" itemscope="itemscope" itemtype="http://schema.org/WPHeader">
          <div id="main-nav" class="navbar navbar-inverse bs-docs-nav" role="banner">
              <div class="container">
                  <?php zerif_before_navbar_trigger(); ?>
                  <div class="navbar-header responsive-logo">
                      <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
                      <span class="sr-only"><?php _e('Toggle navigation','zerif-lite'); ?></span>
                      <span class="icon-bar"></span>
                      <span class="icon-bar"></span>
                      <span class="icon-bar"></span>
                      </button>
                          <div class="navbar-brand" itemscope itemtype="http://schema.org/Organization">
                              <?php
                              if( has_custom_logo() ) {
                                  the_custom_logo();
                              } else {
                              ?>
                                  <div class="site-title-tagline-wrapper">
                                      <h1 class="site-title">
                                          <a href=" <?php echo esc_url( home_url( '/' ) ) ?> ">
                                              <?php bloginfo( 'title' ) ?>
                                          </a>
                                      </h1>
                                      <?php
                                      $description = get_bloginfo( 'description', 'display' );
                                      if ( ! empty( $description ) ) : ?>
                                          <p class="site-description">
                                              <?php echo $description; ?>
                                          </p> <!-- /.site-description -->
                                      <?php elseif( is_customize_preview() ): ?>
                                      <p class="site-description"></p>
                                      <?php endif; ?>
                                  </div> <!-- /.site-title-tagline-wrapper -->
                              <?php } ?>
                          </div> <!-- /.navbar-brand -->
                      </div> <!-- /.navbar-header -->
                  <?php zerif_primary_navigation_trigger(); ?>
              </div> <!-- /.container -->
              <?php zerif_after_header_container_trigger(); ?>
          </div> <!-- /#main-nav -->
          <!-- / END TOP BAR -->
    • توسط vahidlb
      سلام و وقت بخیر خدمت مخاطبان عزیز.
      ابتدا خواهش می کنم این لینک رو ملاحظه بفرمایید.
      منظورم بخش "من متقاضی ... انتخاب کنید ...." هست.
      دوستان می تونید چنین افزونه ای و حتی مشابه اینو به من معرفی بفرمایید.. نیاز بسیار مبرم و حیاتی به این منو دارم
      از دوستانی که می تونن زحمت نوشتن و تولید این افزونه رو بکشن هم لطفاً پیام بدن...
      البته سال گذشته یکی از دوستان این کد را به صورت افزونه تولید کردند و الان هم کار می کنه ولی یکسری تغییرات لازم داره و به مراحلش اضافه شده،
      لذا خواهشمندم اگر ممکنه در این خصوص اعلام نظر بفرماییدو اگر پیشنهادی دارید یا افزونه مشابه اینو می شناسید خیلی ازتون ممنون خواهم شد اگر لطف کنید و راهنماییم کنید.
      با احترام و تشکر
    • توسط koolfayfer
      سلام به همه
      من یه div دارم که پیشفرض به سمت راست میچرخه به مدت نامحدود
      وقتی روش هاور میشی به اندازه یک ثانیه معکوس به سمت چپ میچرخه یه بار!
      حالا اگه کسی بیشتر از یک ثانیه هاور بمونه انیمیشن چرخش اولیه به خاطر وجود انیمیشن هاور stop میشه و میخوام اگه در css ترفندی هست بعد از گذشت یک ثانیه هاور شدن آنهاور بشه یا هر چیز دیگه که باعث بشه انیمیشن پیشفرض کار کنه
      اگه css نبود کسی با جیکوئری میدونه؟