Screenshot of Dittach

Bootstrap, PSD to HTML

A PSD to HTML project with 2 static pages: a landing page that contains a YouTube video player and a success page after sign up.


The client provided all the design in PSD and I manually crafted it into web pages using Bootstrap, featuring a full-screen background image with it's brand color.

Code snippet

$(document).ready(function () {
  var youtube_src = '';

  $('#btn-play-circle').on('click', function () {
    $('#youtube-video').attr('src', youtube_src);

    function () {
      $(this).find('img').attr('src', 'dist/img/img-play-dark.png');
    function () {
      $(this).find('img').attr('src', 'dist/img/img-play.png');

  $('#form-main').on('submit', function () {
    if ($('#email_address').val().length < 1) {
      return false;
    } else {
      return true;

Project post

You may view the project posted at

Now playing :Not playing any music.