Building Impressive Presentations with Impress.js电子书

Building Impressive Presentations with impress.js

Table of Contents

Building Impressive Presentations with impress.js

Credits

About the Author

About the Reviewers

www.PacktPub.com

Support files, eBooks, discount offers and more

Free Access for Packt account holders

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Downloading the example code

Errata

Piracy

Questions

1. Getting Started with Impressive Presentations

What is impress.js?

Built-in features

Beyond presentations with impress.js

Why is it important?

Presentation outline

Using bullet points

Animations

Using themes

Downloading and configuring impress.js

Creating your first presentation

Designing the presentation

Creating the presentation container

Creating your first step

Applying styles on steps

Creating Step 1

Creating Step 2

Limiting the visibility of steps

Presentation overview

Summary

2. Exploring Impress Visualization Effects

Introduction to CSS transformations

Positioning effects

Positioning on the x axis

Positioning on the y axis

Positioning on the z axis

Rotating effects

Rotation around the x axis

Rotation around the y axis

Rotation around the z axis

Rotations in practice

Scaling effects

The importance of positioning in scaling

Scaling in practice

Planning the design

Data perspective

impress.js under the hood

Summary

3. Diving into the Core of impress.js

impress.js configuration

Default configurations

Customizing configurations

Configuring the width and height

Configuring the minScale and maxScale

Configuring the perspective

Configuring the transition duration

Looking at configurations inside the core

Understanding the impress API functions

Inside the next function

Inside the prev function

Inside the goto function

Automating presentations

Creating custom transition timing

impress.js step events

How to use the step class

Working with keyboard configurations

Default keyboard configurations

Inside the impress core

Assigning custom keys for custom events

Adding new keys for new events

Handling the step click event

Summary

4. Presenting on Different Viewports

Fullscreen presentations

Using impress.js inside a container

Developing a content slider

Planning the design

Designing slides

Wrapping the presentation inside a container

Playing the slider automatically

Creating navigation controls

Creating the play/pause features

Adding slide numbers

Highlighting the active slide

impress.js presentations on mobile devices

Issues in designing for mobile devices

Scenario 1

Scenario 2

Scenario 3

Best design practices for mobiles devices

Summary

5. Creating Personal Websites

Planning the website structure

Designing the header

Creating the presentation wrapper

Creating pages

Designing the home page

Designing the portfolio page

Portfolio gallery

Portfolio single

Designing the timeline page

Defining the timeline navigation

Designing the services page

Handling the navigation menu

Creating the navigation hint

Summary

6. Troubleshooting

Browser compatibility

Handling unsupported browsers

Limitations and new features

Positioning steps relative to other steps

Defining the previous and next steps

Transition duration for individual steps

Adding and removing navigation keys

Creating substeps

Troubleshooting and support

Summary

A. Impress Tools and Resources

Impress presentation tools

Strut

Impressionist

Impressive presentations

impress.js demos from the book

Index