A
Anonymous
Guest
Hi!
I am developing a website (wordpress) and there is a page where there is a tabbed <ul> including 3 child <li>.
I have got 3 list item here and one of them appears at the bottom of the other two where is not supposed to. what is wrong? any idea?
here is the code:
<div class="container">
<div class="holder">
<section class="main_container">
<div class="main">
<h1 class="title"><?php echo ucfirst( strtolower( $post->post_title) );?></h1>
<p class="first"><?php echo $post->post_content; ?></p>
<div class="tabs">
<ul class="tab_navigation">
<li><a class="property_tab active" href="#fund_clients">Landlord Clients</a></li>
<li><a class="property_tab" href="#retail_clients">Retail Clients</a></li>
<li><a class="property_tab" href="#leisure_clients">Leisure Clients</a></li>
</ul>
</div>
<div id="fund_clients" class="client_list">
<?php $x = $y = 1; ?>
<?php $num_clients = get_term_post_count_by_type('Fund Clients','clienttype','clients');?>
<?php settype($num_clients, 'integer' );?>
<?php query_posts('post_type=clients&posts_per_page=-1&orderby=title&order=ASC&clienttype=Fund Clients');?>
<?php if ( have_posts() ): ?>
<?php while ( have_posts() ): the_post(); ?>
<?php echo ($x == $y) ? '<div class="row">' : '';?>
<div class="client <?php echo ($x%5 === 0 ) ? 'endofrow' : '';?>
<?php echo ($x > ($num_results - $num_results%5 )) ? 'nomargin' : '';?>
<?php echo ($x == $num_results) ? 'last' : '';?>">
<div class="image">
<?php if ( has_post_thumbnail() ):
$image_id = get_post_thumbnail_id();
$image_arr = wp_get_attachment_image_src($image_id,'thumbnail');
$image_url = $image_arr[0];
$thepdf = get_pdf(get_the_ID());
ob_start();
the_content();
$content = ob_get_contents();
ob_end_clean();
if ( strlen($image_url) > 0 ): ?>
<a href="#" id="client-text_<?php echo get_the_ID(); ?>"
class="<?php echo ( strlen($content) > 0 ) ? 'enabled' : 'disabled';?>">
<div class="client_overlay">
<span>Case Study</span>
</div>
</a>
<img src="<?php echo $image_url; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>"/>
<?php else: ?>
<img src="<?php echo $image_url;?>" alt="<?php the_title(); ?>" />
<?php endif; ?>
<?php else : ?>
<img src="<?php bloginfo('template_url'); ?>/images/grid-image-thumb.gif" alt="Default Image" title="Default Image"/>
<?php endif; ?>
</div>
</div>
<?php $text .= '<div class="case_study"><div class="client_title client-text_'.get_the_ID().'"><h3>'.get_the_title().'</h3>';
$text .= '<a href="#"><div class="close">';
$text .= '<img src="'.get_bloginfo('template_url').'/images/close.png" alt="close" title="close"/></div></a></div>';
$text .= '<div class="info">'.$content;
$document_id = array_keys( $thepdf );
$document_obj = wp_get_single_post($document_id[0] );
if ($thepdf):
$text .= '<a href="'.current($thepdf).'" target="_blank">';
$text .= '<div class="learn_more arrow">Download '.$document_obj->post_excerpt.'</div></a>';
endif;
$text .= '</div><div class="clear"></div></div><div class="clear"></div>';?>
<?php if ( $x == $y + 4 || ($x === $num_clients && ($x < 5) || $x === $num_clients )): ?>
<?php if ( $x != 1 || ($x === $num_clients && ($x < 5))) :?>
<div class="clear"></div>
</div>
<div class="row-text">
<?php echo $text; ?>
<?php unset($text); ?>
</div>
<?php endif; ?>
<?php $y += 5; ?>
<?php endif; ?>
<?php $x++; ?>
<?php endwhile; ?>
<?php endif; ?>
<div class="clear"></div>
</div>
<div id="retail_clients" class="client_list">
<?php $x = $y = 1; ?>
<?php $num_clients = get_term_post_count_by_type('Retail Clients','clienttype','clients');?>
<?php settype($num_clients, 'integer' );?>
<?php query_posts('post_type=clients&posts_per_page=-1&orderby=title&order=ASC&clienttype=Retail Clients');?>
<?php if ( have_posts() ): ?>
<?php while ( have_posts() ): the_post(); ?>
<?php echo ($x == $y) ? '<div class="row">' : '';?>
<div class="client <?php echo ($x%5 === 0 ) ? 'endofrow' : '';?>
<?php echo ($x > ($num_results - $num_results%5 )) ? 'nomargin' : '';?>
<?php echo ($x == $num_results) ? 'last' : '';?>">
<div class="image">
<?php if ( has_post_thumbnail() ):
$image_id = get_post_thumbnail_id();
$image_arr = wp_get_attachment_image_src($image_id,'thumbnail');
$image_url = $image_arr[0];
$thepdf = get_pdf(get_the_ID());
ob_start();
the_content();
$content = ob_get_contents();
ob_end_clean();
if ( strlen($image_url) > 0 ): ?>
<a href="#" id="client-text_<?php echo get_the_ID(); ?>"
class="<?php echo ( strlen($content) > 0 ) ? 'enabled' : 'disabled';?>">
<div class="client_overlay">
<span>Case Study</span>
</div>
</a>
<img src="<?php echo $image_url; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>"/>
<?php else: ?>
<img src="<?php echo $image_url;?>" alt="<?php the_title(); ?>" />
<?php endif; ?>
<?php else : ?>
<img src="<?php bloginfo('template_url'); ?>/images/grid-image-thumb.gif" alt="Default Image" title="Default Image"/>
<?php endif; ?>
</div>
</div>
<?php $text .= '<div class="case_study"><div class="client_title client-text_'.get_the_ID().'"><h3>'.get_the_title().'</h3>';
$text .= '<a href="#"><div class="close">';
$text .= '<img src="'.get_bloginfo('template_url').'/images/close.png" alt="close" title="close"/></div></a></div>';
$text .= '<div class="info">'.$content.'</div>';
if ($thepdf[97]):
$text .= '<a href="'.$thepdf[97].'<div class="learn_more arrow">Download PDF</div></a>';
endif;
$text .= '</div>';?>
<?php if ( $x == $y + 4 || ($x === $num_clients && ($x < 5) || $x === $num_clients )): ?>
<?php if ( $x != 1 || ($x === $num_clients && ($x < 5))) :?>
<div class="clear"></div>
</div>
<div class="row-text">
<?php echo $text; ?>
<?php unset($text); ?>
</div>
<?php endif; ?>
<?php $y += 5; ?>
<?php endif; ?>
<?php $x++; ?>
<?php endwhile; ?>
<?php endif; ?>
<div class="clear"></div>
</div>
<div id="leisure_clients" class="client_list">
<?php $x = $y = 1; ?>
<?php $num_clients = get_term_post_count_by_type('Leisure Clients','clienttype','clients');?>
<?php settype($num_clients, 'integer' );?>
<?php query_posts('post_type=clients&posts_per_page=-1&orderby=title&order=ASC&clienttype=Leisure Clients');?>
<?php if ( have_posts() ): ?>
<?php while ( have_posts() ): the_post(); ?>
<?php echo ($x == $y) ? '<div class="row">' : '';?>
<div class="client <?php echo ($x%5 === 0 ) ? 'endofrow' : '';?>
<?php echo ($x > ($num_results - $num_results%5 )) ? 'nomargin' : '';?>
<?php echo ($x == $num_results) ? 'last' : '';?>">
<div class="image">
<?php if ( has_post_thumbnail() ):
$image_id = get_post_thumbnail_id();
$image_arr = wp_get_attachment_image_src($image_id,'thumbnail');
$image_url = $image_arr[0];
$thepdf = get_pdf(get_the_ID());
ob_start();
the_content();
$content = ob_get_contents();
ob_end_clean();
if ( strlen($image_url) > 0 ): ?>
<a href="#" id="client-text_<?php echo get_the_ID(); ?>"
class="<?php echo ( strlen($content) > 0 ) ? 'enabled' : 'disabled';?>">
<div class="client_overlay">
<span>Case Study</span>
</div>
</a>
<img src="<?php echo $image_url; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>"/>
<?php else: ?>
<img src="<?php echo $image_url;?>" alt="<?php the_title(); ?>" />
<?php endif; ?>
<?php else : ?>
<img src="<?php bloginfo('template_url'); ?>/images/grid-image-thumb.gif" alt="Default Image" title="Default Image"/>
<?php endif; ?>
</div>
</div>
<?php $text .= '<div class="case_study"><div class="client_title client-text_'.get_the_ID().'"><h3>'.get_the_title().'</h3>';
$text .= '<a href="#"><div class="close">';
$text .= '<img src="'.get_bloginfo('template_url').'/images/close.png" alt="close" title="close"/></div></a></div>';
$text .= '<div class="info">'.$content;
$document_id = array_keys( $thepdf );
$document_obj = wp_get_single_post($document_id[0] );
if ($thepdf):
$text .= '<a href="'.current($thepdf).'" target="_blank">';
$text .= '<div class="learn_more arrow">Download '.$document_obj->post_excerpt.'</div></a>';
endif;
$text .= '</div><div class="clear"></div></div><div class="clear"></div>';?>
<?php if ( $x == $y + 4 || ($x === $num_clients && ($x < 5) || $x === $num_clients )): ?>
<?php if ( $x != 1 || ($x === $num_clients && ($x < 5))) :?>
<div class="clear"></div>
</div>
<div class="row-text">
<?php echo $text; ?>
<?php unset($text); ?>
</div>
<?php endif; ?>
<?php $y += 5; ?>
<?php endif; ?>
<?php $x++; ?>
<?php endwhile; ?>
<?php endif; ?>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</section>
<aside class="module">
<?php get_sidebar('speaktous'); ?>
<?php get_sidebar('latestnews'); ?>
</aside>
</div>
</div>
And also the jquery:
jQuery('.tabs ul').hide();
jQuery('.tabs li a.active').next().show();
jQuery('.tabs li a').click(
function() {
var checkElement = jQuery(this).next();
if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
return false;
}
if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
jQuery('.tabs ul:visible').slideUp('normal');
jQuery('.property_search .tabs a').removeClass('active')
jQuery(this).addClass('active');
checkElement.slideDown('normal');
return false;
}
}
);
Thanks a lot in advance!
Cheers
I am developing a website (wordpress) and there is a page where there is a tabbed <ul> including 3 child <li>.
I have got 3 list item here and one of them appears at the bottom of the other two where is not supposed to. what is wrong? any idea?
here is the code:
<div class="container">
<div class="holder">
<section class="main_container">
<div class="main">
<h1 class="title"><?php echo ucfirst( strtolower( $post->post_title) );?></h1>
<p class="first"><?php echo $post->post_content; ?></p>
<div class="tabs">
<ul class="tab_navigation">
<li><a class="property_tab active" href="#fund_clients">Landlord Clients</a></li>
<li><a class="property_tab" href="#retail_clients">Retail Clients</a></li>
<li><a class="property_tab" href="#leisure_clients">Leisure Clients</a></li>
</ul>
</div>
<div id="fund_clients" class="client_list">
<?php $x = $y = 1; ?>
<?php $num_clients = get_term_post_count_by_type('Fund Clients','clienttype','clients');?>
<?php settype($num_clients, 'integer' );?>
<?php query_posts('post_type=clients&posts_per_page=-1&orderby=title&order=ASC&clienttype=Fund Clients');?>
<?php if ( have_posts() ): ?>
<?php while ( have_posts() ): the_post(); ?>
<?php echo ($x == $y) ? '<div class="row">' : '';?>
<div class="client <?php echo ($x%5 === 0 ) ? 'endofrow' : '';?>
<?php echo ($x > ($num_results - $num_results%5 )) ? 'nomargin' : '';?>
<?php echo ($x == $num_results) ? 'last' : '';?>">
<div class="image">
<?php if ( has_post_thumbnail() ):
$image_id = get_post_thumbnail_id();
$image_arr = wp_get_attachment_image_src($image_id,'thumbnail');
$image_url = $image_arr[0];
$thepdf = get_pdf(get_the_ID());
ob_start();
the_content();
$content = ob_get_contents();
ob_end_clean();
if ( strlen($image_url) > 0 ): ?>
<a href="#" id="client-text_<?php echo get_the_ID(); ?>"
class="<?php echo ( strlen($content) > 0 ) ? 'enabled' : 'disabled';?>">
<div class="client_overlay">
<span>Case Study</span>
</div>
</a>
<img src="<?php echo $image_url; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>"/>
<?php else: ?>
<img src="<?php echo $image_url;?>" alt="<?php the_title(); ?>" />
<?php endif; ?>
<?php else : ?>
<img src="<?php bloginfo('template_url'); ?>/images/grid-image-thumb.gif" alt="Default Image" title="Default Image"/>
<?php endif; ?>
</div>
</div>
<?php $text .= '<div class="case_study"><div class="client_title client-text_'.get_the_ID().'"><h3>'.get_the_title().'</h3>';
$text .= '<a href="#"><div class="close">';
$text .= '<img src="'.get_bloginfo('template_url').'/images/close.png" alt="close" title="close"/></div></a></div>';
$text .= '<div class="info">'.$content;
$document_id = array_keys( $thepdf );
$document_obj = wp_get_single_post($document_id[0] );
if ($thepdf):
$text .= '<a href="'.current($thepdf).'" target="_blank">';
$text .= '<div class="learn_more arrow">Download '.$document_obj->post_excerpt.'</div></a>';
endif;
$text .= '</div><div class="clear"></div></div><div class="clear"></div>';?>
<?php if ( $x == $y + 4 || ($x === $num_clients && ($x < 5) || $x === $num_clients )): ?>
<?php if ( $x != 1 || ($x === $num_clients && ($x < 5))) :?>
<div class="clear"></div>
</div>
<div class="row-text">
<?php echo $text; ?>
<?php unset($text); ?>
</div>
<?php endif; ?>
<?php $y += 5; ?>
<?php endif; ?>
<?php $x++; ?>
<?php endwhile; ?>
<?php endif; ?>
<div class="clear"></div>
</div>
<div id="retail_clients" class="client_list">
<?php $x = $y = 1; ?>
<?php $num_clients = get_term_post_count_by_type('Retail Clients','clienttype','clients');?>
<?php settype($num_clients, 'integer' );?>
<?php query_posts('post_type=clients&posts_per_page=-1&orderby=title&order=ASC&clienttype=Retail Clients');?>
<?php if ( have_posts() ): ?>
<?php while ( have_posts() ): the_post(); ?>
<?php echo ($x == $y) ? '<div class="row">' : '';?>
<div class="client <?php echo ($x%5 === 0 ) ? 'endofrow' : '';?>
<?php echo ($x > ($num_results - $num_results%5 )) ? 'nomargin' : '';?>
<?php echo ($x == $num_results) ? 'last' : '';?>">
<div class="image">
<?php if ( has_post_thumbnail() ):
$image_id = get_post_thumbnail_id();
$image_arr = wp_get_attachment_image_src($image_id,'thumbnail');
$image_url = $image_arr[0];
$thepdf = get_pdf(get_the_ID());
ob_start();
the_content();
$content = ob_get_contents();
ob_end_clean();
if ( strlen($image_url) > 0 ): ?>
<a href="#" id="client-text_<?php echo get_the_ID(); ?>"
class="<?php echo ( strlen($content) > 0 ) ? 'enabled' : 'disabled';?>">
<div class="client_overlay">
<span>Case Study</span>
</div>
</a>
<img src="<?php echo $image_url; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>"/>
<?php else: ?>
<img src="<?php echo $image_url;?>" alt="<?php the_title(); ?>" />
<?php endif; ?>
<?php else : ?>
<img src="<?php bloginfo('template_url'); ?>/images/grid-image-thumb.gif" alt="Default Image" title="Default Image"/>
<?php endif; ?>
</div>
</div>
<?php $text .= '<div class="case_study"><div class="client_title client-text_'.get_the_ID().'"><h3>'.get_the_title().'</h3>';
$text .= '<a href="#"><div class="close">';
$text .= '<img src="'.get_bloginfo('template_url').'/images/close.png" alt="close" title="close"/></div></a></div>';
$text .= '<div class="info">'.$content.'</div>';
if ($thepdf[97]):
$text .= '<a href="'.$thepdf[97].'<div class="learn_more arrow">Download PDF</div></a>';
endif;
$text .= '</div>';?>
<?php if ( $x == $y + 4 || ($x === $num_clients && ($x < 5) || $x === $num_clients )): ?>
<?php if ( $x != 1 || ($x === $num_clients && ($x < 5))) :?>
<div class="clear"></div>
</div>
<div class="row-text">
<?php echo $text; ?>
<?php unset($text); ?>
</div>
<?php endif; ?>
<?php $y += 5; ?>
<?php endif; ?>
<?php $x++; ?>
<?php endwhile; ?>
<?php endif; ?>
<div class="clear"></div>
</div>
<div id="leisure_clients" class="client_list">
<?php $x = $y = 1; ?>
<?php $num_clients = get_term_post_count_by_type('Leisure Clients','clienttype','clients');?>
<?php settype($num_clients, 'integer' );?>
<?php query_posts('post_type=clients&posts_per_page=-1&orderby=title&order=ASC&clienttype=Leisure Clients');?>
<?php if ( have_posts() ): ?>
<?php while ( have_posts() ): the_post(); ?>
<?php echo ($x == $y) ? '<div class="row">' : '';?>
<div class="client <?php echo ($x%5 === 0 ) ? 'endofrow' : '';?>
<?php echo ($x > ($num_results - $num_results%5 )) ? 'nomargin' : '';?>
<?php echo ($x == $num_results) ? 'last' : '';?>">
<div class="image">
<?php if ( has_post_thumbnail() ):
$image_id = get_post_thumbnail_id();
$image_arr = wp_get_attachment_image_src($image_id,'thumbnail');
$image_url = $image_arr[0];
$thepdf = get_pdf(get_the_ID());
ob_start();
the_content();
$content = ob_get_contents();
ob_end_clean();
if ( strlen($image_url) > 0 ): ?>
<a href="#" id="client-text_<?php echo get_the_ID(); ?>"
class="<?php echo ( strlen($content) > 0 ) ? 'enabled' : 'disabled';?>">
<div class="client_overlay">
<span>Case Study</span>
</div>
</a>
<img src="<?php echo $image_url; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>"/>
<?php else: ?>
<img src="<?php echo $image_url;?>" alt="<?php the_title(); ?>" />
<?php endif; ?>
<?php else : ?>
<img src="<?php bloginfo('template_url'); ?>/images/grid-image-thumb.gif" alt="Default Image" title="Default Image"/>
<?php endif; ?>
</div>
</div>
<?php $text .= '<div class="case_study"><div class="client_title client-text_'.get_the_ID().'"><h3>'.get_the_title().'</h3>';
$text .= '<a href="#"><div class="close">';
$text .= '<img src="'.get_bloginfo('template_url').'/images/close.png" alt="close" title="close"/></div></a></div>';
$text .= '<div class="info">'.$content;
$document_id = array_keys( $thepdf );
$document_obj = wp_get_single_post($document_id[0] );
if ($thepdf):
$text .= '<a href="'.current($thepdf).'" target="_blank">';
$text .= '<div class="learn_more arrow">Download '.$document_obj->post_excerpt.'</div></a>';
endif;
$text .= '</div><div class="clear"></div></div><div class="clear"></div>';?>
<?php if ( $x == $y + 4 || ($x === $num_clients && ($x < 5) || $x === $num_clients )): ?>
<?php if ( $x != 1 || ($x === $num_clients && ($x < 5))) :?>
<div class="clear"></div>
</div>
<div class="row-text">
<?php echo $text; ?>
<?php unset($text); ?>
</div>
<?php endif; ?>
<?php $y += 5; ?>
<?php endif; ?>
<?php $x++; ?>
<?php endwhile; ?>
<?php endif; ?>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</section>
<aside class="module">
<?php get_sidebar('speaktous'); ?>
<?php get_sidebar('latestnews'); ?>
</aside>
</div>
</div>
And also the jquery:
jQuery('.tabs ul').hide();
jQuery('.tabs li a.active').next().show();
jQuery('.tabs li a').click(
function() {
var checkElement = jQuery(this).next();
if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
return false;
}
if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
jQuery('.tabs ul:visible').slideUp('normal');
jQuery('.property_search .tabs a').removeClass('active')
jQuery(this).addClass('active');
checkElement.slideDown('normal');
return false;
}
}
);
Thanks a lot in advance!
Cheers