Design Using Light Box 2

Demo Light Box 2 là một mã nguồn tạo hiệu ứng ảnh được tạo bởi Lokesh Dhakar, đây là một mã nguồn khá cổ đã được 8 năm, nhưng nó vẫn còn rất mạnh mẽ và được các thiết kế viên áp dụng vào nhiều trang web trên thế giới. Hiệu ứng ảnh nó cung cấp là khi click chuột vào một hình ảnh nhỏ nó sẽ làm mờ đi trang web bằng một lớp mờ và hiển thị kích thước hình ảnh lớn hơn vừa với màn hình trình duyệt đang hiển thị, tất nhiên nếu hình ảnh nhỏ hơn màn hình thì nó sẽ hiển thị kích gốc của hình ảnh. Để biết thêm thông tin về cách sử dụng bạn truy cập vào trang web http://lokeshdhakar.com/projects/lightbox2/, còn bài này chỉ cung cấp mã nguồn của mình thiết kế có sử dụng Light Box 2 thôi ^^.


Download:

Index HTML Source Light Box 2:
<!DOCTYPE html>

<html lang="en-us">

<head>


    <!-- Using Lightbox 2

    Lightbox2 is a script created by Lokesh Dhakar. It creates an overlay of your image and unfolds it on top of the current webpage. It's the original lightbox script. After eight years later, it's still going strong! This article will guide using LightBox 2 to your website. -->


    <meta charset="utf-8">

    <title>BNSON BLOG: Lightbox Demo</title>

    <link rel="stylesheet" href="css/lightbox.css">



    <style type='text/css'>
        body {
            background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSIHVT82d-_uLLdL5iig_Tqs3RKeoVl4bEhTDwLrntNMUfU8IXHPEmJUPTqvoFCGku6f0zptcy0U8eTPUWceZhz5k9ruREjPwehiwShVsa8psEx0uWTOpJR91O3vR12qdZeesH4ruA2eo/s1600/blurry-blue-light.jpg);
            background-size: cover;
            padding: 30px;
            margin: 0px;
            padding: 0px;
        }
       
        h2 {
            text-align: center;
            text-transform: uppercase;
            color: #fff;
            font-weight: bold;
            font-size: 20px;
            border-bottom: 1px solid #fff;
        }
       
        a {
            color: #fff;
            font-weight: normal;
        }
       
        a:hover {
            color: #fff;
            font-weight: bold;
        }
       
        a:visible {
            color: #fff;
        }
       
        section {
            background: #eee;
            width: 100%;
            max-width: 960px;
            min-width: 320px;
            margin: 25px auto;
            padding: 20px;
            overflow: hidden;
            background-color: rgba(255, 255, 255, 0.3);
            -webkit-box-shadow: 0px 0px 29px -7px rgba(0, 0, 0, 0.65);
            -moz-box-shadow: 0px 0px 29px -7px rgba(0, 0, 0, 0.65);
            box-shadow: 0px 0px 29px -7px rgba(0, 0, 0, 0.65);
            text-align: center;
        }
       
        section img {
            max-width: 100%;
            max-height: 100%
        }
       
        .title {
            text-align: center;
            text-transform: uppercase;
            color: #fff;
            font-weight: bold;
            font-size: 24px;
        }
       
        section div {
            float: left;
            width: 280px;
            height: 160px;
            padding: 10px;
            margin: 10px;
            border: 0px;
            background: #fff;
            display: inline-block;
        }
       
        .clear {
            clear: both;
        }
    </style>



</head>

<body>


    <section class="title">
        <p>
            Back to article: <a href="http://bnson.blogspot.com/">http://bnson.blogspot.com/</a>
        </p>
    </section>


    <section>
        <h2>Lightbox Simple images</h2>
        <div>
            <a class="example-image-link" data-lightbox="image-1" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQzcPaQiQTSm7mrtSUhKqnCllE6b0lweEHE9kfM-5eEZ9kJHIQx67xzNAu_FhVLcY7uZHN4pRLhx1C40Nyzj6L7YrJBkfnLfiIJ3DLM2YLIW6ec2jlnsN_izFchFSPXlwVfMocBz9ziXo/s0/beautiful-girl-004.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQzcPaQiQTSm7mrtSUhKqnCllE6b0lweEHE9kfM-5eEZ9kJHIQx67xzNAu_FhVLcY7uZHN4pRLhx1C40Nyzj6L7YrJBkfnLfiIJ3DLM2YLIW6ec2jlnsN_izFchFSPXlwVfMocBz9ziXo/s320/beautiful-girl-004.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-2" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOe7r3en2-MqeXEU-HL9LHaDM6zb1cdcaOpawBN3DYIkUQ0L1OXfAtVL8Ipmwg7gUlR8CkPSXYG7-Zdfemje2CqgPRNwawe7oNh98pTpED-J-cXtNMTK2aogxW4zoy3YNO0M_UXLOCuaU/s0/beautiful-girl-006.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOe7r3en2-MqeXEU-HL9LHaDM6zb1cdcaOpawBN3DYIkUQ0L1OXfAtVL8Ipmwg7gUlR8CkPSXYG7-Zdfemje2CqgPRNwawe7oNh98pTpED-J-cXtNMTK2aogxW4zoy3YNO0M_UXLOCuaU/s320/beautiful-girl-006.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-3" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqXhglh2LNzp3RqzNVdfYC64l94xy9HP3E1XhG_K0MMqFgzrT5WKqMB4A5mXuuVGIGy0i-q5rF8HXYUa_UmZ7VBF5r9Oxk7oJ6ejTRg3jIZfPxHk__eqMAarjGpzzGQsoLWdbeEP9lCa8/s0/beautiful-girl-007.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqXhglh2LNzp3RqzNVdfYC64l94xy9HP3E1XhG_K0MMqFgzrT5WKqMB4A5mXuuVGIGy0i-q5rF8HXYUa_UmZ7VBF5r9Oxk7oJ6ejTRg3jIZfPxHk__eqMAarjGpzzGQsoLWdbeEP9lCa8/s320/beautiful-girl-007.jpg" /></a>
        </div>
        <p class="clear"></p>
    </section>

    <section>
        <h2>Lightbox Simple images with title</h2>
        <div>
            <a class="example-image-link" data-lightbox="image-4" data-title="LightBox Image Title 001." href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghXeCIpCkBZi3nLF15AY7hcnNsy0YnhwH4X49OYEBpRE0I9nDBge4t-bVzrMyN1ihg1b_fGq5cGOItBwlQZp3Bh9uo7vqxYYoK-k7Wt-6ge8AEN_ZFQDwF5X4ah24LvRfDMFYtM4wI-4E/s0/beautiful-girl-001.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghXeCIpCkBZi3nLF15AY7hcnNsy0YnhwH4X49OYEBpRE0I9nDBge4t-bVzrMyN1ihg1b_fGq5cGOItBwlQZp3Bh9uo7vqxYYoK-k7Wt-6ge8AEN_ZFQDwF5X4ah24LvRfDMFYtM4wI-4E/s320/beautiful-girl-001.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-5" data-title="LightBox Image Title 002." href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNo3b0viRTZCxKOuvyALtN7t2bnC5Rn3g9awRddb-4jpOBLKXbHkHu6dsm07gP1kd6rbZQtM95hrWyM1jS8LquqmdnJiWuEcWJyI1Esix4uTaz1z4yHxG6Qx3iU6E2CkvklNw-yzWHfLU/s0/beautiful-girl-002.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNo3b0viRTZCxKOuvyALtN7t2bnC5Rn3g9awRddb-4jpOBLKXbHkHu6dsm07gP1kd6rbZQtM95hrWyM1jS8LquqmdnJiWuEcWJyI1Esix4uTaz1z4yHxG6Qx3iU6E2CkvklNw-yzWHfLU/s320/beautiful-girl-002.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-6" data-title="LightBox Image Title 003." href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIqCtpw9-4y2CH3m4pwX274kgZaTF8aeP-miEiFtSmVbpk71cqPsi0EwujCaHH1sRrSPK9j58ClForPxWGdjY28EcFbRtqFV_LDymLmEuYHZ6kxXlz7mWrNSnYI8FwQy7WkdkI7gGRYTs/s0/beautiful-girl-003.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIqCtpw9-4y2CH3m4pwX274kgZaTF8aeP-miEiFtSmVbpk71cqPsi0EwujCaHH1sRrSPK9j58ClForPxWGdjY28EcFbRtqFV_LDymLmEuYHZ6kxXlz7mWrNSnYI8FwQy7WkdkI7gGRYTs/s320/beautiful-girl-003.jpg" /></a>
        </div>
        <p class="clear"></p>
    </section>



    <section>
        <h2>Lightbox with group of related images</h2>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOdRX2JJt1KQGVCWaqdciYJEVuLR3yoHw_DJ0-2LZ67-xAzxOsVQ-jH2o3nXBHywZ_7y1RsHtCF_mTlSW4TNlKzAjLAAhNrCCVOzIiKEqcYHwKGJXFsv5e_Sz5tbkmErUdzQ0_WrAJUwU/s0/beautiful-girl-024.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOdRX2JJt1KQGVCWaqdciYJEVuLR3yoHw_DJ0-2LZ67-xAzxOsVQ-jH2o3nXBHywZ_7y1RsHtCF_mTlSW4TNlKzAjLAAhNrCCVOzIiKEqcYHwKGJXFsv5e_Sz5tbkmErUdzQ0_WrAJUwU/s320/beautiful-girl-024.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJFkgXrONjHLr4PzEZKx7tZi9jrawFC2lUuYoWSzYpcVVWYBBhDVRz9-xHz5TlXzWs-c8PUANrOtRILKRosyEBDw2_An0Wjl8EaTzBeGkiE3lUCuX9EObUV79wjGRxoUTKLedl5sjNpEM/s0/beautiful-girl-005.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJFkgXrONjHLr4PzEZKx7tZi9jrawFC2lUuYoWSzYpcVVWYBBhDVRz9-xHz5TlXzWs-c8PUANrOtRILKRosyEBDw2_An0Wjl8EaTzBeGkiE3lUCuX9EObUV79wjGRxoUTKLedl5sjNpEM/s320/beautiful-girl-005.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKY4l__UczbPOT_ryfmXF4fKuz22AGwYxHKhYSxJU40duAiNY7rmfohKjBmBIlRlUzHm-kWb9KPZcDgqxGfpWUBy3377ZFO6U9Xo4qMKUDOvwg3xxBE9QSMxeDy1UX77lLUQjQBPgXLOc/s0/beautiful-girl-025.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKY4l__UczbPOT_ryfmXF4fKuz22AGwYxHKhYSxJU40duAiNY7rmfohKjBmBIlRlUzHm-kWb9KPZcDgqxGfpWUBy3377ZFO6U9Xo4qMKUDOvwg3xxBE9QSMxeDy1UX77lLUQjQBPgXLOc/s320/beautiful-girl-025.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGd87aiGKwpi5VnGcQBB7oADKtBNCBktt9qzHvAcULF_8kYgwTBCAzX1V595qzGTS2FxklIfLi8ARJfDRdBY2zQDRm4A0wOp1x9T7K5agsjb0TYVrsdoMqZfx1UAsUecDMbDW__Hr9TTo/s0/beautiful-girl-026.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGd87aiGKwpi5VnGcQBB7oADKtBNCBktt9qzHvAcULF_8kYgwTBCAzX1V595qzGTS2FxklIfLi8ARJfDRdBY2zQDRm4A0wOp1x9T7K5agsjb0TYVrsdoMqZfx1UAsUecDMbDW__Hr9TTo/s320/beautiful-girl-026.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_Sc4fGf4YERIEND8McKEdxNZJNTAVq3DwvQR19iDTdB1nWv4frzxKF_nosHEtid-1yhgXHhbAfoeKY1o7chNx2ZYykDXb3lEGj5vVg2yIatgU1WFq145T_B0Z1Cto7AY7_JlzvUlWeF8/s0/beautiful-girl-008.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_Sc4fGf4YERIEND8McKEdxNZJNTAVq3DwvQR19iDTdB1nWv4frzxKF_nosHEtid-1yhgXHhbAfoeKY1o7chNx2ZYykDXb3lEGj5vVg2yIatgU1WFq145T_B0Z1Cto7AY7_JlzvUlWeF8/s320/beautiful-girl-008.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgRYlws105BxjUpZ7tf2q1VBUZ89P_WClJ0Z8j_JOrE5QZXCPyKWcVNelneHvCX7y09125yYM2sC2e4uObDyqWggsrJh_oQP8aZveumPLa8_gbRLAFACYD8pSyoPNHYFBTJIqreZiO_V4/s0/beautiful-girl-009.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgRYlws105BxjUpZ7tf2q1VBUZ89P_WClJ0Z8j_JOrE5QZXCPyKWcVNelneHvCX7y09125yYM2sC2e4uObDyqWggsrJh_oQP8aZveumPLa8_gbRLAFACYD8pSyoPNHYFBTJIqreZiO_V4/s320/beautiful-girl-009.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiXRfmgVedykXWATfQtHGC1dz3dyiDt2JRPab3XIdZN0G4fUnSLT6BHWmbXSLU_k4oyn24SSS2f3drjv4RYQHaG81mtqD3YASsZZ2j9dQR4iZRwMifFOKCFFOBS9kWCQjJOTYRLonhVpE/s0/beautiful-girl-010.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiXRfmgVedykXWATfQtHGC1dz3dyiDt2JRPab3XIdZN0G4fUnSLT6BHWmbXSLU_k4oyn24SSS2f3drjv4RYQHaG81mtqD3YASsZZ2j9dQR4iZRwMifFOKCFFOBS9kWCQjJOTYRLonhVpE/s320/beautiful-girl-010.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivPhbG4MIhOct32IFyBXtz_mRBhy8-k0nAg3GsnyBuqhxj2of6sUS6OannRsPWqq3b_kjbiHcuHrUFROy9Bz69thQhnaYq7uA-wGOviIYIFzgc_LDrn-iSj3IiWBv__1HczArYlsZUgeY/s0/beautiful-girl-011.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivPhbG4MIhOct32IFyBXtz_mRBhy8-k0nAg3GsnyBuqhxj2of6sUS6OannRsPWqq3b_kjbiHcuHrUFROy9Bz69thQhnaYq7uA-wGOviIYIFzgc_LDrn-iSj3IiWBv__1HczArYlsZUgeY/s320/beautiful-girl-011.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWfbxfn9BNIqDMndpO5jKNzhlN6M32j7LgQsJ6Zb6S13ictReeE0iFAMZ9tal2bhVuE6w-JXJREoBbSpAV31kyen1pZBrLTMKTRo-LSfbJWozJOgevmNOtLTWpYDf1IGx24tRBTccGWG8/s0/beautiful-girl-012.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWfbxfn9BNIqDMndpO5jKNzhlN6M32j7LgQsJ6Zb6S13ictReeE0iFAMZ9tal2bhVuE6w-JXJREoBbSpAV31kyen1pZBrLTMKTRo-LSfbJWozJOgevmNOtLTWpYDf1IGx24tRBTccGWG8/s320/beautiful-girl-012.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlPDJAxuAxKvPNzjwD03jVfG5_EI8VPetFAkdUVSPCCVXqOaeo7Ei033i_KWnNi7G_RLTUBVFnVbiqq7P2pOTDEAXUH8_UMuL28v6vhhxo3mcihMpOCsVHVGsqnpPDJc0GjbHdJ76Tkyo/s0/beautiful-girl-014.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlPDJAxuAxKvPNzjwD03jVfG5_EI8VPetFAkdUVSPCCVXqOaeo7Ei033i_KWnNi7G_RLTUBVFnVbiqq7P2pOTDEAXUH8_UMuL28v6vhhxo3mcihMpOCsVHVGsqnpPDJc0GjbHdJ76Tkyo/s320/beautiful-girl-014.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijOduymr_X_vFcgoyrwdXI4c0lk92VMYzprSvCbttTusjHMNydiVFHCnsXUv3G2BIsnO7YN_zYsIrSzsHB7hvKIYZADEocxPo1PaCKUE3BovCEzqzecPClZem2z-_KZlhd43R_UjJqxkE/s0/beautiful-girl-016.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijOduymr_X_vFcgoyrwdXI4c0lk92VMYzprSvCbttTusjHMNydiVFHCnsXUv3G2BIsnO7YN_zYsIrSzsHB7hvKIYZADEocxPo1PaCKUE3BovCEzqzecPClZem2z-_KZlhd43R_UjJqxkE/s320/beautiful-girl-016.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOaQwiRUT1BB2LaEhY8_iW4fYJ0nci2tpcg8qJJ-H18VUK0UhuM3qYJ235u6GHc2PS9EuesP3HWYiDcej_8u2QEyiJplj4VTyOQLH8DN12BIgmHQmuxC5PTEThPQ9iUEX_CiYKF-B1gQI/s0/beautiful-girl-017.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOaQwiRUT1BB2LaEhY8_iW4fYJ0nci2tpcg8qJJ-H18VUK0UhuM3qYJ235u6GHc2PS9EuesP3HWYiDcej_8u2QEyiJplj4VTyOQLH8DN12BIgmHQmuxC5PTEThPQ9iUEX_CiYKF-B1gQI/s320/beautiful-girl-017.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRyCyR4mAV_8xBhdHKee6I3KSg17RACvJLbz7q7l3m3NwLNhf4Fz_kqLaN0wJiY2yQ3gbilLEB0o8IcGDobXa7Y54fKzX7KWC7FFMsonfITzvOvi_YiGyHGPTWD6UxR19XR_VO9nKqG6A/s0/beautiful-girl-018.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRyCyR4mAV_8xBhdHKee6I3KSg17RACvJLbz7q7l3m3NwLNhf4Fz_kqLaN0wJiY2yQ3gbilLEB0o8IcGDobXa7Y54fKzX7KWC7FFMsonfITzvOvi_YiGyHGPTWD6UxR19XR_VO9nKqG6A/s320/beautiful-girl-018.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjojigYyee6gF9KHrlegefZXDEOQLXpVkyLAjLJ6-XmM2kfJDrzvCPJZvAvTIwSCs6bQuKH0trUNVeALQ_IiEnZ6y4g-PWZWVg7CgGYA68RRisqwSnCCOOWs8lJmF057YmyVwVwG24qTn8/s0/beautiful-girl-019.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjojigYyee6gF9KHrlegefZXDEOQLXpVkyLAjLJ6-XmM2kfJDrzvCPJZvAvTIwSCs6bQuKH0trUNVeALQ_IiEnZ6y4g-PWZWVg7CgGYA68RRisqwSnCCOOWs8lJmF057YmyVwVwG24qTn8/s320/beautiful-girl-019.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrwdnbGCPgZHN16TkuAu0V6KQ3tbqnDE-ZVvOwNgdh8Qvv0p3kEUCgwEsnt-WHygYvbresATtryEPFOxYDy0yf3aWLqCW2SZQfNCTMQWt7F8t4ww-kVDTPFUtTiQxHo4mMDbhvTmlldcA/s0/beautiful-girl-020.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrwdnbGCPgZHN16TkuAu0V6KQ3tbqnDE-ZVvOwNgdh8Qvv0p3kEUCgwEsnt-WHygYvbresATtryEPFOxYDy0yf3aWLqCW2SZQfNCTMQWt7F8t4ww-kVDTPFUtTiQxHo4mMDbhvTmlldcA/s320/beautiful-girl-020.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiTLbDgpDUp5Y119iazuT8Mt7lisHE05DvjqFzsFkDYOXQAxQBthWZemRj7bpRqCmrYwvRgN0xpBMhHh1HLcRylYNAQpbmU1cYnVQiDMB1ieYJgNbMsOg0Y3WsA0UB-tINbpUyk_kZB64/s0/beautiful-girl-021.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiTLbDgpDUp5Y119iazuT8Mt7lisHE05DvjqFzsFkDYOXQAxQBthWZemRj7bpRqCmrYwvRgN0xpBMhHh1HLcRylYNAQpbmU1cYnVQiDMB1ieYJgNbMsOg0Y3WsA0UB-tINbpUyk_kZB64/s320/beautiful-girl-021.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtIawwelk_f2j3g4SQ9wmm0DdZpI7xxXHPuI_NbRMN7h2CMQ3FvWi7zws2kVbsGIrmKJP0sAnx1se47MTU3pMk12FNssaLcwrILXg4DOTY9RBT3jA5DuONFsrYCC8cByW1ggQZS_3NJpM/s0/beautiful-girl-022.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtIawwelk_f2j3g4SQ9wmm0DdZpI7xxXHPuI_NbRMN7h2CMQ3FvWi7zws2kVbsGIrmKJP0sAnx1se47MTU3pMk12FNssaLcwrILXg4DOTY9RBT3jA5DuONFsrYCC8cByW1ggQZS_3NJpM/s320/beautiful-girl-022.jpg" /></a>
        </div>
        <div>
            <a class="example-image-link" data-lightbox="image-group" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBPyHuaBe9eXSmbSify7t0X4XejAlqj3CyTmIpol5iuOntqI9TLwpTtBovYeHROfhjkT2XQk3xZYWb3rhE3ve_wjoGjr3El5at2Iv4uxXY_QezGyLV0JSoBW-Di3PKYhYuIE6T359JRsw/s0/beautiful-girl-023.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBPyHuaBe9eXSmbSify7t0X4XejAlqj3CyTmIpol5iuOntqI9TLwpTtBovYeHROfhjkT2XQk3xZYWb3rhE3ve_wjoGjr3El5at2Iv4uxXY_QezGyLV0JSoBW-Di3PKYhYuIE6T359JRsw/s320/beautiful-girl-023.jpg" /></a>
        </div>
    </section>


    <section class="title">
        <p>
            Back to article: <a href="http://bnson.blogspot.com/">http://bnson.blogspot.com/</a>
        </p>
    </section>

</body>

<script src='js/jquery-1.9.1.js'></script>
<script src='js/lightbox.js'></script>

</html>


Demo Light Box 2:



















Posted by at
Labels: , , , , , , , , , ,

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)