0

我正在制作一个滑块选项卡,我知道有很多插件,但我不想使用插件。所以我想显示我的类别帖子标题并像下面的 html 格式一样发布,但我不能。我尝试了我的方式,但我的方式只有内容循环而不是标题。如果能够像下面这样制作 html,那么标签将起作用。伙计们,我该怎么做。

    <ul class="tabs">
    <li><a href="#content_1" rel="tab_1" class="tab active_tab">Tabs 1</a></li>
    <li><a href="#content_2" rel="tab_2" class="tab">Tabs 2</a></li>
    <li><a href="#content_3" rel="tab_3" class="tab">Tabs 3</a></li>
    <li><a href="#content_4" rel="tab_4" class="tab">Tabs 4</a></li>
    <li><a href="#content_5" rel="tab_5" class="tab">Tabs 5</a></li>
    </ul>

so here under li (tabs) put post title 




<div id="content_1" class="tab_view first_tab">
                    <h2>Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div>

<div id="content_1" class="tab_view first_tab">
                    <h2>Horizontal Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div>
<div id="content_1" class="tab_view first_tab">
                    <h2>Horizontal Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div>
<div id="content_1" class="tab_view first_tab">
                    <h2>Horizontal Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div><div id="content_1" class="tab_view first_tab">
                    <h2>Horizontal Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div>

仔细查看href="#content_1" rel="tab_1"这个#content_ (1,2,3,4,5) 应该是自动的。类似 <div id="content_1"这个内容_也将自动编号我的意思是帖子编号

4

1 回答 1

0

你可以试试这个

     $args = array(
'post_type' => array('post'), 
'orderby' => 'post_date',
'category_name'=>'my category name' ,
'showposts' => 5 );
$array= get_posts($args); ?>
<ul class="tabs">
 for ($i = 0; $i < count($array); $i++) { ?>    
<li><a href="#content_<?php echo $i+1; ?>" rel="tab_<?php echo $i+1; ?>" class="tab">Tabs 

<?php echo $i+1; ?></a></li>

<?php
$divs.='<div id="content_'.($i+1).'" class="tab_view first_tab">
<h2>'.$array[$i]->post_title.'</h2>
<p>'.$array[$i]->post_content.'</p>                         
                </div>';    
 } ?>
 </ul>

<?php $divs; ?>
于 2013-07-24T06:03:56.433 回答