پویا کردن باکس های اچ تی ام ال

[نسـتـــرن 194]

سلام

دوستان این کده اچ تی ام ال اسلایدر ضمیمه شده هست:

البته خودم خلاصه اش کردم:

  <div class="cn_wrapper">
   <div id="cn_preview" class="cn_preview">
    <div class="cn_content" style="top:5px;">
	 <img src="images/polaroidphotobar.jpg" alt=""/>
	 <h1>Polaroid Photobar Gallery with jQuery</h1>
	 <span class="cn_date">28/09/2010</span>
	 <span class="cn_category">Tutorials</span>
	 <p>In this tutorial we are going to create an image gallery with a Polaroid look.
	  We will have albums that will expand to sets of slightly rotated thumbnails
	  that pop out on hover.</p>
	 <a href="http://tympanus.net/codrops/2010/09/28/polaroid-photobar-gallery/" target="_blank" class="cn_more">Read more</a>
    </div>
   </div>
   <div id="cn_list" class="cn_list">
    <div class="cn_page" style="display:block;">
	 <div class="cn_item selected">
	  <h2>Polaroid Photobar Gallery with jQuery</h2>
	  <p>Tutorial on how to create a gallery in polaroid style</p>
	 </div>
	 <div class="cn_item">
	  <h2>Full Page Image Gallery with jQuery</h2>
	  <p>Another tutorial on how to make a full page image gallery with some jQuery</p>
	 </div>
    </div>
    <div class="cn_page">
	 <div class="cn_item">
	  <h2>Music Portfolio Template</h2>
	  <p>A template for a music portfolio website with an HTML5 audio player</p>
	 </div>
	 <div class="cn_item">
	  <h2>Related Posts Slide Out Boxes</h2>
	  <p>Show users more of your articles with these slide out boxes</p>
	 </div>
	 <div class="cn_item">
	  <h2>Latest Tweets Tooltip with jQuery</h2>
	  <p>A Plugin for showing the latest tweets with a certain word in your article</p>
	 </div>
	 <div class="cn_item">
	  <h2>Slide Down Box Menu with jQuery and CSS3</h2>
	  <p>A menu with a nice effect</p>
	 </div>
    </div>
    <div class="cn_nav">
	 <a id="cn_prev" class="cn_prev disabled"></a>
	 <a id="cn_next" class="cn_next"></a>
    </div>
   </div>
  </div>

من این رو میخوام برای وردپرس به کار ببرم.به گونه ای عنوان و خلاصه ای از جدیدترین مطالب رو تو این دستور نشون بده:

<div class="cn_item selected">
<h2>Polaroid Photobar Gallery with jQuery</h2>
<p>Tutorial on how to create a gallery in polaroid style</p>
</div>

تو اون h2 عنوان رو نشون بده،تو p خلاصه مطلب رو.

و از کد زیر هم :

    <div class="cn_content" style="top:5px;">
	 <img src="images/polaroidphotobar.jpg" alt=""/>
	 <h1>Polaroid Photobar Gallery with jQuery</h1>
	 <span class="cn_date">28/09/2010</span>
	 <span class="cn_category">Tutorials</span>
	 <p>In this tutorial we are going to create an image gallery with a Polaroid look.
	  We will have albums that will expand to sets of slightly rotated thumbnails
	  that pop out on hover.</p>
	 <a href="http://tympanus.net/codrops/2010/09/28/polaroid-photobar-gallery/" target="_blank" class="cn_more">Read more</a>
    </div>

آدرس img src بشه تصاویر شاخص مطالب جدید

h1 بشه عنوانش

اون تاریخ ها و دسته بندی ها هم برای هر مطلب عوض شه و p هم باز خلاصه

ممنون میشم راهنماییم کنین

دموی اصلی:

http://www.htmldrive.net/items/demo/656/jQuery-scroll-News-Previewer

[Morteza 34190]

میخواین وردپرسی کنید؟

[نسـتـــرن 194]

بله.