alskhda

css/structure.css

@@ -26,9 +26,7 @@
     z-index: -1;
 }
 
-#wrapper {
+
-    z-index:100;
-}
 
 body {
     background: url(img/bg_texture.png) repeat-x repeat-y;
@@ -42,14 +40,14 @@ body {
     overflow: hidden;
 }*/
 
-   #bx-wrapper {
-    margin: 0 auto !important;
-    width: 100% !important;
-   }
 
 .arrow {
 }
 
+#wrapper {
+    margin-top: 2em;
+}
+
 #go-next, #go-prev {
     transition: opacity 0.5s;
     -moz-transition: opacity 0.5s; /* Firefox 4 */

js/javascript.js

@@ -1,9 +1,9 @@
 function load_slides() {
     var filelist = [
-        "What is the world made of",
         "The strong interaction",
-        "The electromagnetic interaction",
     "The weak interaction",
+    "What is the world made of",
+    "The electromagnetic interaction",
     "Three Generations",
     "Antimatter",
     "The Higgs"
@@ -21,14 +21,12 @@ function load_slides() {
         var filename = to_filename(filelist[i]);
         // get 
         var chapter = get_html(filename, "chapter", "html", last);
-        //var readmore = get_html(filelist[i], "readmore", "html");
+        var readmore = get_html(filelist[i], "readmore", "html");
         // here we just need the URL
         //var icon = get_html(filelist[i], "img", "png");
         //
         //alert (chapter);
 
-
-
     }
 
 }
@@ -45,7 +43,9 @@ function get_html(file, prefix, extension, last ){
     }
     ).done( function(data) {
         //alert('<li class="slide"><div>' + data + "</div></li>");
+        if (prefix == "chapter") {
             $("#slider").append('<li class="slide"><div class="span12">' + data + "</div></li>");
+        }
         //$("ul.nav-pills").append('<li><a href="#">' + $(data).find('h1').text() + '</a></li>');
         if (last) {
             set_sliders();
@@ -59,6 +59,6 @@ function get_html(file, prefix, extension, last ){
 
 function fill_menu() {
     $($(".slide").get()).each(function() {
-        $("ul.nav-pills").append('<li><a href="#">' + $(this).find('h1').html() + '</a></li>');
+        $("ul.nav-pills").append('<li><img style="width:3em;height:3em;"><a href="#">' + $(this).find('h1').html() + '</a></li>');
     });
 }

main.html

@@ -36,6 +36,14 @@
             <div id="right-hidden">
             </div>-->
         </div>
+        <div class="modal hide fade" id="readmore">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal">x</button>
+            </div>
+            <div class="modal-body">
+
+            </div>
+        </div>
         <div id="topbar">
             <div class="navigation">
                 <ul class="nav nav-pills" >
@@ -44,6 +52,7 @@
             </div>
             <a id="nav-button" class="pull-right" href="#">Nav me!! <i class="icon-chevron-down
                     icon-white"></i> </a> 
+            <a class="btn" data-toggle="modal" href="#readmore" >Read more</a>
         </div>
 
         <script>