php - How do I say IF class #1 on left, if class #2 on right in loop -


i have loop in wordpress spit out 2 classes. 1 class photos, other video. once new photo or video added, adds below last div.

example:    photos   photos   video   photos   video 

so need happen is, need photos left , videos right. tried using float:left , float:right , clear:left; , clear:right; , it's not working planned since divs set @ 50%. if not cleared, go in rows photos, photos, new row, video, photos.

i thinking there php can use, saying if photos, in column, if videos in other column.

i tried following:

 .photos { float: left; width: 50%; display: block; clear: left;  }  .video { float:right; width:50%; display: block; clear:none;   } 

and also:

.photos { float: left; width: 50%; display: block; clear: none;  }  .video { float:right; width:50%; display: block; clear:none;   } 

i want videos go right , photos left top bottom. can't separate 2 in 2 different div's because in loop.

here array:

<?php while (have_posts()) : the_post(); ?>   <?php do_action( 'bp_before_blog_post' ); ?>    <div id="post-<?php the_id(); ?>" <?php post_class(); ?>>   <div class="thumbl">   <?php   if ( has_post_thumbnail() ) { // check if post has post thumbnail assigned it.   the_post_thumbnail('thumbnail');   } ?>   </div>   <div class="date"><?php printf( __( '%1$s', 'buddypress' ), get_the_date(), get_the_category_list( ', ' ) ); ?></div>       <div class="post-content">      <h2 class="posttitle"><a href="../../plugins/buddypress/bp-themes/bp-default/<?php the_permalink(); ?>" rel="bookmark" title="<?php _e( 'permanent link to', 'buddypress' ); ?> <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>    <div class="entry">     <?php the_excerpt( __( 'read rest of entry &rarr;', 'buddypress' ) ); ?> <?php wp_link_pages( array( 'before' => '<div class="page-link"><p>' . __( 'pages: ', 'buddypress' ), 'after' => '</p></div>', 'next_or_number' => 'number' ) ); ?>  </div>     </div>   </div>   <?php do_action( 'bp_after_blog_post' ); ?> <?php endwhile; ?> 

and code example only:

<div id="post-175" class="post-175 photos type-photos status-publish hentry category-media"></div> <div id="post-176" class="post-175 photos type-photos status-publish hentry category-media"></div> <div id="post-177" class="post-175 video type-photos status-publish hentry category-media"></div> <div id="post-178" class="post-175 photos type-photos status-publish hentry category-media"></div> <div id="post-179" class="post-175 video type-photos status-publish hentry category-media"></div> <div id="post-180" class="post-175 photos type-photos status-publish hentry category-media"></div> 

notice second class of each photos , videos

to answer own question, found solution!!!

place code above loop

 <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 

put below div's outside loop

<div class="photodiv"><div></div></div>  <script>$("div.photos").wrapall($(".photodiv"));</script> 

this wraps new div around class .photos can float left!

if understand correctly, photos left , videos right, solution:

<style> .main {width:800px;} .main > div >span {clear:both;float:left;} .video {width:400px;float:right;"} .photo {width:400px;float:left;"} </style>  <div class="main">     <div class="video">         <span>video1</span>         <span>video2</span>     </div>     <div class="photo">         <span>photos1</span>         <span>photos2</span>         <span>photos3</span>     </div> </div> 

Comments

Popular posts from this blog

SPSS keyboard combination alters encoding -

Add new record to the table by click on the button in Microsoft Access -

CSS3 Transition to highlight new elements created in JQuery -