添加混合javascript函數，以使內容淡入一列內的另一內容中/使此功能適用於兩個單獨的列

Question

javascript混合功能 ----->列中的一個內容（文本，圖像）可以通過按下方形按鈕（1或2）淡入第二個內容，並且可以選擇再次返回第一個內容。

可以在此處找到具有兩個內容的一欄上的淡入淡出效果動畫的功能的完整代碼：

的jsfiddle

現在將其添加到4列上： 結果---->所有4列都扭曲了，全部垂直放置在一行上，並且該函數扭曲了列的大小。

將函數添加到div中后，請用4列進行編碼，這是一個災難。 注意：我為4列使用toogle css / html結構，因為它是最好的布局。

的jsfiddle

• 如何在第1列和第4列上正確添加此功能 （總共2列具有此效果）

  • 使用具有此功能的兩列，是否需要多功能腳本 ？ what needs to be added make both work? （我對JavaScript不太了解）

* *本來應該是每行2列的列的原始結構。

的jsfiddle

* 無法將所有代碼放在這里，因為沒有足夠的空間在此處發布（僅提及），因此知道大多數時候必須添加它。 *

Answer 1

編輯：嘗試一下JQuery Fixed JSFiddle和新HTML
修復了HTML故障， 修復了HTML和CSS最新的HTML看起來像這樣

<div class="wrapper">
    <div id="outer" class="cf">
        <!-- first -->
        <div class="holder f_left">
            <div class="column">
                <div class="column_title">
                    2014
                </div>
                <h4>GOLD</h4>
                <hr>
                <div class="entry-content" id="box1_c1">
                    <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                        <div class="shadow">
                            <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_right">
                            <p>Universe itself is infinite erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj
                                rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash
                                hrhqw jrqwlrqwjrytturtu</p>
                            <div class="square" contentId="c1">1</div>
                            <div class="square" contentId="c2">2</div>

                        </div>
                        <!-- end of shadow -->
                    </div>
                    <!-- end of post -->
                </div>
                <!-- end of entry-content box1_c1 -->

                <div class="entry-content" id="box1_c2" style="display: none">
                    <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                        <div class="shadow">
                            <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_left">
                            <p>SECOND SIDE erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi
                                rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu</p>
                            <div class="square" contentId="c1">1</div>
                            <div class="square" contentId="c2">2</div>

                        </div>
                        <!-- end of shadow -->
                    </div>
                    <!-- end of post -->
                </div>
                <!-- end of entry-content box1_c2 -->
            </div>
            <!--  end of column -->
        </div>
        <!-- end of holder -->

        <!-- second -->
        <div class="holder f_left">
            <div class="column">
                <div class="column_title">
                    2014
                </div>
                <h4>PEARL</h4>
                <hr>
                <div class="entry-content" id="box2_c1">
                    <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                        <div class="shadow">
                            <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_right">
                            <p>Universe itself is infinite erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj
                                rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash
                                hrhqw jrqwlrqwjrytturtu</p>
                            <div class="square" contentId="c1">1</div>
                            <div class="square" contentId="c2">2</div>

                        </div>
                        <!-- end of shadow -->
                    </div>
                    <!-- end of post -->
                </div>
                <!-- end of entry-content box2_c1 -->

                <div class="entry-content" id="box2_c2" style="display: none">
                    <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                        <div class="shadow">
                            <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_left">
                            <p>SECOND SIDE erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi
                                rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu</p>
                            <div class="square" contentId="c1">1</div>
                            <div class="square" contentId="c2">2</div>

                        </div>
                        <!-- end of shadow -->
                    </div>
                    <!-- end of post -->
                </div>
                <!-- end of entry-content box2_c2 -->
            </div>
            <!-- end of column -->
        </div>
        <!-- end of holder -->

        <!-- third -->
        <div class="holder f_left">
            <div class="column">
                <div class="column_title">
                    2013
                </div>
                <h4>ROSE</h4>
                <hr>
                <div class="entry-content" id="box3_c1">
                    <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                        <div class="shadow">
                            <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_right">
                            <p>Universe itself is infinite erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj
                                rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash
                                hrhqw jrqwlrqwjrytturtu</p>
                            <div class="square" contentId="c1">1</div>
                            <div class="square" contentId="c2">2</div>

                        </div>
                        <!-- end of shadow -->
                    </div>
                    <!-- end of post -->
                </div>
                <!-- end of entry-content box3_c1 -->

                <div class="entry-content" id="box3_c2" style="display: none">
                    <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                        <div class="shadow">
                            <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_left">
                            <p>SECOND SIDE erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi
                                rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu</p>
                            <div class="square" contentId="c1">1</div>
                            <div class="square" contentId="c2">2</div>

                        </div>
                        <!-- end of shadow -->
                    </div>
                    <!-- end of post -->
                </div>
                <!-- end of entry-content box3_c2 -->
            </div>
            <!--  end of column -->
        </div>
        <!-- end of holder -->

        <!-- fourth -->
        <div class="holder f_left">
            <div class="column">
                <div class="column_title">
                    Sep 2013
                </div>
                <h4>LIME</h4>
                <hr>
                <div class="entry-content" id="box4_c1">
                    <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                        <div class="shadow">
                            <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_right">
                            <p>Universe itself is infinite erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj
                                rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash
                                hrhqw jrqwlrqwjrytturtu</p>
                            <div class="square" contentId="c1">1</div>
                            <div class="square" contentId="c2">2</div>

                        </div>
                        <!-- end of shadow -->
                    </div>
                    <!-- end of post -->
                </div>
                <!-- end of entry-content box4_c1 -->

                <div class="entry-content" id="box4_c2" style="display: none">
                    <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                        <div class="shadow">
                            <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_left">
                            <p>SECOND SIDE erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi
                                rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu</p>
                            <div class="square" contentId="c1">1</div>
                            <div class="square" contentId="c2">2</div>

                        </div>
                        <!-- end of shadow -->
                    </div>
                    <!-- end of post -->
                </div>
                <!-- end of entry-content box4_c2 -->
            </div>
            <!-- end of column -->
        </div>
        <!-- end of holder -->

    </div>
    <!-- end of outer -->
</div>
<!-- end of wrapper -->

jQuery看起來像這樣：

$(document).on("click", ".square", function () {
    var id = $(this).attr("contentId");
    var box_name_full = $(this).closest('div.entry-content').attr('id');
    var box_split = $(this).closest('div.entry-content').attr('id').split("_");
    var box_name = box_split[0];
    var box_c = box_split[1];

    //alert("box_name_full = " + box_name_full);
    //alert("box_name = " + box_name);
    //alert("box_c = " + box_c);

    if ($("#" + box_name + "_" + id).is(":visible"))
        $("#" + box_name + "_" + id).fadeOut("slow").hide();


    if (id == "c1") {
        //Make the first square box red color
        $("div[id^='" + box_name + "'] div.square[contentId='c1']").css('background', 'red');
        //Make the second square box gray color
        $("div[id^='" + box_name + "'] div.square[contentId='c2']").css('background', '#CCC');

        if ($("#" + box_name + "_" + "c2").is(":visible")) {
            $("#" + box_name + "_" + "c2").fadeOut("slow").hide();
        }
        $("#" + box_name + "_" + id).fadeIn('slow').show();
    } else if (id == "c2") {
        //Make the second square box red color
        $("div[id^='" + box_name + "'] div.square[contentId='c2']").css('background', 'red');
        //Make the first square box gray color
        $("div[id^='" + box_name + "'] div.square[contentId='c1']").css('background', '#CCC');

        if ($("#" + box_name + "_" + "c1").is(":visible")) {
            $("#" + box_name + "_" + "c1").fadeOut("slow").hide();
        }
        $("#" + box_name + "_" + id).fadeIn("slow").show();
    }
});

我從那個JSFiddle清理了HTML

每當您的HTML變得奇怪時，只需將其放入該網站http://jsbeautifier.org/中 ，您將看到任何錯誤，例如extra </div>等。

在包裝的結束之前，包裝盒的末端在第2個物品盒的末端之后結束，現在它一直在所有4個物品盒的末端終止。 仍然可能是JavaScript錯誤，但這只是一個開始。

繼承了新的JSFiddle和僅具有HTML的新JSFiddle

單擊兩個紅色方塊時，您會注意到的第一個問題是第二個紅色方塊幾乎是正確的..但是第一個默認紅色方塊是錯誤的..這​​是因為第一個紅色方塊的HTML錯誤

第一項內容有

<div class="entry-content" id="c1">

里面有一個

<div id="details">
<div style="display">
<div class="post type-post status-publish format-standard hentry category-uncategorized entry">
<div class="shadow">

4個不同的<div>

現在第二個有

<div class="entry-content" style="display: none" id="c2">

只有

<div class="shadow">

因此，也許第一個只需要一個<div class="shadow">而沒有別的嗎？ 我現在可以告訴你，第一個不需要<div style="display">這行什么也不做。

以下是您的整個HTML，僅從第一個刪除了<div style="display>和</div>

<body>
    <!-- onload="clickMenu('outer','div','more')" -->
    <div class="wrapper">
        <div id="outer" class="cf">
            <div class="column f_left">
                <!-- first -->
                <div class="holder">
                    <div class="column_box">
                        <div class="column_title">
                            2014
                        </div>
                        <h4>GOLD</h4>
                        <hr>
                        <div class="entry-content" id="c1">
                            <div id="details">
                                <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                                    <div class="shadow">
                                        <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_right">
                                        <p>Universe itself is infinite erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash
                                            hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj</p>
                                        <div class="square" contentId="c1">1</div>
                                        <div class="square" contentId="c2">2</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- end of entry-content c1 -->
                        <div class="entry-content" style="display: none" id="c2">
                            <div class="shadow">
                                <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_left">
                                <p>SECOND SIDE erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu
                                    tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash hrhqw jrqwlrqwjrytturtu hjshj hafshfash
                                    hrhqw jrqwlrqwjrytturtu</p>

                                <div class="square" contentId="c1"></div>
                                <div class="square" contentId="c2"></div>

                            </div>
                            <!-- end of shadow -->
                        </div>
                        <!-- end of entry-content c2 -->
                    </div>
                    <!-- end of post (column_box) -->
                </div>
                <!-- end of holder -->
            </div>
            <!--  end of column f_left -->
        </div>
        <!--  end of outer cf -->

        <!-- second -->
        <div class="holder">
            <div class="column_box">
                <div class="column_title">
                    2014
                </div>
                <h4>PEARL</h4>
                <hr>
                <div class="entry-content">
                    <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                        <div class="shadow">
                            <img src="images/ody.png" width="140" height="147" alt="img" class="img_left f_left">
                            <p>rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashrjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashrjrw jrwjrwhwrj jarjearjar jrajrajraj ytre
                                ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashjrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashjrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashjrajrajraj ytre ryeyrey rrturtu tyyiyiyi
                                rytturtu hjshj hafshfashjrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash</p>
                            <!-- this is disabled.
                                <div class="more">
                                    <i class="show">more &#187;</i>
                                    <i class="hide">&#171; less</i>
                                    <br />
                                    <img src="more/rabbit.jpg" alt="rabbit" title="">
                                    <p>So she was considering, in her own mind (as well as she could, for the hot day made her feel very sleepy and stupid), whether the pleasure of making a daisy-chain would be worth the trouble of getting up and picking the daisies, when suddenly a White Rabbit with pink eyes ran close by her.</p>
                                    <p>There was nothing so very remarkable in that; nor did Alice think it so very much out of the way to hear the Rabbit say to itself "Oh dear! Oh dear! I shall be too late!" (when she thought it over afterwards it occurred to her that she ought to have wondered at this, but at the time it all</p>
                                </div> <!~~ close more ~~>
 -->
                        </div>
                        <!-- end of shadow -->
                    </div>
                    <!-- end of post -->
                </div>
                <!-- end of entry-content -->
            </div>
            <!-- end of column_box -->
        </div>
        <!-- end of holder -->

        <div class="column f_left">
            <!-- third -->
            <div class="holder">
                <div class="column_box">
                    <div class="column_title">
                        2013
                    </div>
                    <h4>DIAMOND</h4>
                    <hr>
                    <div class="entry-content">
                        <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                            <div class="shadow">
                                <img src="images/ody.png" width="140" height="147" alt="img" class="img_right f_right">
                                <p>Universe itself is infinite erj rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjshj hafshfash hrhqw
                                    jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwjhjsw jrqwlrqwjhjshj hafshfash hrhqw jrqwlrqwj rrturtu tyyiyiyi rytturtu hjshj hafshfash hrhqw jrqwlrqwj</p>
                                <!-- disabled content
                                <div class="more">
                                    <i class="show">more &#187;</i>
                                    <i class="hide">&#171; less</i>
                                    <br />
                                    <img src="more/rabbit.jpg" alt="rabbit" title="">
                                    <p>So she was considering, in her own mind (as well as she could, for the hot day made her feel very sleepy and stupid), whether the pleasure of making a daisy-chain would be worth the trouble of getting up and picking the daisies, when suddenly a White Rabbit with pink eyes ran close by her.</p>
                                    <p>There was nothing so very remarkable in that; nor did Alice think it so very much out of the way to hear the Rabbit say to itself "Oh dear! Oh dear! I shall be too late!" (when she thought it over afterwards it occurred to her that she ought to have wondered at this, but at the time it all</p>
                                </div> <!~~ close more ~~>
 -->
                            </div>
                            <!-- end of shadow -->
                        </div>
                        <!-- end of post -->
                    </div>
                    <!-- end of entry-content -->
                </div>
                <!--  end of column_box -->
            </div>
            <!-- end of holder -->

            <!-- fourth -->
            <div class="holder">
                <div class="column_box">
                    <div class="column_title">
                        Sep 2013
                    </div>
                    <h4>ROSE</h4>
                    <hr>
                    <div class="entry-content">
                        <div class="post type-post status-publish format-standard hentry category-uncategorized entry">
                            <div class="shadow">
                                <img src="images/ody.png" width="140" height="147" alt="img" class="img_left f_left">
                                <p>rjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashrjrw jrwjrwhwrj jarjearjar jrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashrjrw jrwjrwhwrj jarjearjar jrajrajraj
                                    ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashjrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashjrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfashjrajrajraj ytre ryeyrey rrturtu
                                    tyyiyiyi rytturtu hjshj hafshfashjrajrajraj ytre ryeyrey rrturtu tyyiyiyi rytturtu hjshj hafshfash</p>
                                <!--
                                <div class="more">
                                    <i class="show">more &#187;</i>
                                    <i class="hide">&#171; less</i>
                                    <br />
                                    <img src="more/rabbit.jpg" alt="rabbit" title="">
                                    <p>So she was considering, in her own mind (as well as she could, for the hot day made her feel very sleepy and stupid), whether the pleasure of making a daisy-chain would be worth the trouble of getting up and picking the daisies, when suddenly a White Rabbit with pink eyes ran close by her.</p>
                                    <p>There was nothing so very remarkable in that; nor did Alice think it so very much out of the way to hear the Rabbit say to itself "Oh dear! Oh dear! I shall be too late!" (when she thought it over afterwards it occurred to her that she ought to have wondered at this, but at the time it all</p>
                                </div> <!~~ close more ~~>
 -->
                            </div>
                            <!-- end of shadow -->
                        </div>
                        <!-- end of post -->
                    </div>
                    <!-- end of entry-content -->
                </div>
                <!-- end of column_box -->
            </div>
            <!-- end of holder -->
        </div>
        <!-- end of column f_left -->
    </div>
    <!-- end of wrapper -->