Lecture/en

From 2011.igem.org

(Difference between revisions)
(Created page with "{{Kyoto_Background}} {{Kyoto_Foreground|active_page=consideration}} {{Kyoto_WikiDesign}}")
Line 2: Line 2:
{{Kyoto_Foreground|active_page=consideration}}
{{Kyoto_Foreground|active_page=consideration}}
{{Kyoto_WikiDesign}}
{{Kyoto_WikiDesign}}
 +
 +
        <div id="backpanel">
 +
        <div id="album">
 +
<!-- start album -->
 +
            <div id="album_base">
 +
                <div class="album_panel">[[File:kyoto_lec_2.1.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.2.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.3.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.4.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.5.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.6.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.7.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.8.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.9.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.10.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.11.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.12.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.13.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.14.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.15.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.16.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.17.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.18.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.19.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.20.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.21.png]]</div>
 +
                <div class="album_panel">[[File:kyoto_lec_2.22.png]]</div>
 +
            </div>
 +
        </div>
 +
<!-- end album -->
 +
        </div>
 +
<html>
 +
        <div id="control">
 +
            <input type="button" value="prev" onclick="prev()"></input>
 +
            <input type="button" value="next" onclick="next()"></input>
 +
        </div>
 +
    </div>
 +
 +
<style type="text/css">
 +
#backpanel {
 +
    width: 700px;
 +
    height: 525px;
 +
    margin: 0px auto;
 +
    padding: 10px;
 +
    background-color: #eeeeee;
 +
}
 +
 +
#album {
 +
    position: absolute;
 +
    width: 700px;
 +
    height: 525px;
 +
    margin: 0px;
 +
    padding: 0px;
 +
    overflow: hidden;
 +
}
 +
 +
#album_base {
 +
    position: absolute;
 +
    width: 700px;
 +
    height: 525px;
 +
    background-color: #ffffff;
 +
}
 +
 +
.album_panel {
 +
    width: 700px;
 +
    height: 525px;
 +
    margin: 0px;
 +
    padding: 0px;
 +
    float: left;
 +
}
 +
 +
#control {
 +
    margin: 0px auto;
 +
    width: 350px;
 +
    text-align: center;
 +
}
 +
</style>
 +
<script src="http://code.jquery.com/jquery-latest.js"></script>
 +
<script type="text/javascript">
 +
    var x_0 = 0;
 +
    var x_max = 0;
 +
 +
function init_album() {
 +
    var parent = $("#album_base");
 +
    var children = $("#album_base").children();
 +
    x_max = (children.length-1) * children.outerWidth();
 +
    parent.css("width",x_max+children.outerWidth());
 +
}
 +
 +
function prev() {
 +
    var base = $("#album_base");
 +
    if (base.position().left >= x_0) return;
 +
    var panel = base.children();
 +
    base.animate({
 +
        "left" : base.position().left+panel.outerWidth()
 +
    },500,function(){});
 +
}
 +
 +
function next() {
 +
    var base = $("#album_base");
 +
    if (base.position().left <= -x_max) return;
 +
    var panel = base.children();
 +
    base.animate({
 +
        "left" : base.position().left-panel.outerWidth()
 +
    },500,function(){});
 +
}
 +
init_album();
 +
</script>
 +
</html>

Revision as of 18:23, 5 October 2011

Kyoto lec 2.1.png
Kyoto lec 2.2.png
Kyoto lec 2.3.png
Kyoto lec 2.4.png
Kyoto lec 2.5.png
Kyoto lec 2.6.png
Kyoto lec 2.7.png
Kyoto lec 2.8.png
Kyoto lec 2.9.png
Kyoto lec 2.10.png
Kyoto lec 2.11.png
Kyoto lec 2.12.png
Kyoto lec 2.13.png
Kyoto lec 2.14.png
Kyoto lec 2.15.png
Kyoto lec 2.16.png
Kyoto lec 2.17.png
Kyoto lec 2.18.png
Kyoto lec 2.19.png
Kyoto lec 2.20.png
Kyoto lec 2.21.png
Kyoto lec 2.22.png

Retrieved from "http://2011.igem.org/Lecture/en"