Book Image

Responsive Web Design by Example : Beginner's Guide

By : Thoriq Firdaus
Book Image

Responsive Web Design by Example : Beginner's Guide

By: Thoriq Firdaus

Overview of this book

Table of Contents (16 chapters)
Responsive Web Design by Example Beginner's Guide Second Edition
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Time for action – compiling JavaScript with Koala


  1. Create a new JavaScript file named html5shiv.js in assets/js directory.

  2. Import html5shiv.js from the HTML5Shiv package we downloaded through Bower into this file:

    // @koala-prepend "../../bower_components/html5shiv/dist/html5shiv.js"
  3. Create a new JavaScript file named bootstrap.js.

  4. In bootstrap.js, import the JavaScript libraries that are required to turn the off-canvas navigation functionality on, as follows:

    // @koala-prepend "../../bower_components/jquery/dist/jquery.js"
    // @koala-prepend "../../bower_components/bootstrap/js/transition.js"
    // @koala-prepend "../../bower_components/jasny-bootstrap/js/offcanvas.js"
  5. Open Koala and ensure that the Auto Compile option for html5shiv.js and bootstrap.js is checked, as shown in the following screenshot:

  6. Also, make sure that the output path of these two JavaScript files is set to the /assets/js directory, as shown in the following screenshot:

  7. Compile both these JavaScript files by clicking on the Compile...