相对定位的div如何动态地封装其所有嵌套的绝对位置元素？

Question

我想使用三个相互重叠的div（每个div包含图像和一些文本）来创建横幅，并且彼此淡入/淡出效果。我没有设置封闭div的高度，因为网络响应速度很快。

HTML如下：

public function __construct() //Controller constructor
{
    parent::__construct();
    $this->load->helper('url');
    $this->load->model('ServiceModel'); //load your model
}

public function create()
{
    $data = array (
        'service_name' => $this->input->post('service_name'),
        'status' => $this->input->post('available')
    );

    $res['status'] = '0'; // default status response
    $model = new ServiceModel(); //create an instance of your model
    $response = $model->insertData($data); // insert the data

    if($response) //if the insert was successful(true) set "status" = 1
    {
        $res['status'] = '1';
    }

    echo json_encode($res);
}

在上面，幻灯片彼此重叠，我可以使用jquery将这些幻灯片淡入/淡出。 但是，“内容文本”不能显示在横幅下方。如何解决？

非常感谢。