How to Show/Hide two div on single button click with javascript

solution :-


$('#id1').on('click', function(){
        var ele = document.getElementById("div1");
        var ele1 = document.getElementById("div2");
        ele1.style.display = "none";
        if(ele.style.display == "block") {
                ele.style.display = "none"; 
ele1.style.display = "block";              
          }
        else {
            ele.style.display = "block";
ele1.style.display = "none";            
        }
    });

how to set a active class on first div in wordpress

<?php $firstMarked = false; ?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
<div class="item <?php echo !$firstMarked ? "active":"";?>">
  <?php the_post_thumbnail('full');?>
  <div class="container">
    <div class="caption">
      <h1>
        <?php the_title(); ?>
      </h1>
      <p>
        <?php the_excerpt(); ?>
      </p>
    </div>
  </div>
</div>
<?php $firstMarked = true;?>
<?php endwhile; ?>

How to Build WordPress Navigation Using wp_nav_menu()

<?php

$defaults = array(
 'theme_location'  => '',
 'menu'            => '',
 'container'       => 'div',
 'container_class' => '',
 'container_id'    => '',
 'menu_class'      => 'menu',
 'menu_id'         => '',
 'echo'            => true,
 'fallback_cb'     => 'wp_page_menu',
 'before'          => '',
 'after'           => '',
 'link_before'     => '',
 'link_after'      => '',
 'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',
 'depth'           => 0,
 'walker'          => ''
);
 
wp_nav_menu( $defaults );

?>

wp_nav_menu shortcode

wp_nav_menu shortcode

To install the shortcode just place this code inside functions.php file of your theme.

// Function that will return our Wordpress menu
function list_menu($atts, $content = null) {
 extract(shortcode_atts(array(  
  'menu'            => '', 
  'container'       => 'div', 
  'container_class' => '', 
  'container_id'    => '', 
  'menu_class'      => 'menu', 
  'menu_id'         => '',
  'echo'            => true,
  'fallback_cb'     => 'wp_page_menu',
  'before'          => '',
  'after'           => '',
  'link_before'     => '',
  'link_after'      => '',
  'depth'           => 0,
  'walker'          => '',
  'theme_location'  => ''), 
  $atts));
 
 
 return wp_nav_menu( array( 
  'menu'            => $menu, 
  'container'       => $container, 
  'container_class' => $container_class, 
  'container_id'    => $container_id, 
  'menu_class'      => $menu_class, 
  'menu_id'         => $menu_id,
  'echo'            => false,
  'fallback_cb'     => $fallback_cb,
  'before'          => $before,
  'after'           => $after,
  'link_before'     => $link_before,
  'link_after'      => $link_after,
  'depth'           => $depth,
  'walker'          => $walker,
  'theme_location'  => $theme_location));
}
//Create the shortcode
add_shortcode("listmenu", "list_menu");

How to remove the arrows from input[type=“number”] in Google chrome , Firefox and Opera etc...

I've been using some simple CSS and it seems to remove them and work fine.

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin: 0;
}

Web standards is the present and future in web design – the way all websites should be design and implemented. Websites created using web standards load faster, have better search engine ranking and are easier to update. All the websites I show here have been created this way.