current location:Home > Technical Articles > Web Front-end > H5 Tutorial

  • Detailed introduction to HTML5 video playback
    Detailed introduction to HTML5 video playback
    First, we introduce the artifact jPlayer: jPlayer, an audio and video player based on HTML5/Flash, is a completely free and open source (MIT) jQuery multimedia library plug-in written in JavaScript (now also a Zepto plug-in); jPlayer allows you to quickly write a cross-platform The platform's web pages support audio and video playback. jPlayer's rich API allows you to create a personalized multimedia application, and therefore has gained support and support from more and more community members.
    H5 Tutorial 2592 2017-07-23 13:49:34
  • Implement an example of an HTML5 music player
    Implement an example of an HTML5 music player
    Technical points: ES6+Webpack+HTML5 Audio+Sass Here, we will learn step by step how to implement an H5 music player from scratch. First, let’s take a look at the final implementation: Demo link Next, let’s get to the point: to be a music player, you need to have a good understanding of the way audio is played on the Web. The audio tag of HTML5 is usually used. Regarding the audio tag, it has a lot Here I will give a general introduction to its properties, methods and events. Attributes: src: required, audio source
    H5 Tutorial 6129 2017-07-23 13:28:16
  • html5 new network landscape
    html5 new network landscape
    Since the birth of HTML5, a standard principle has been established, that is, all technologies must be open and cannot have patents. During the entire period, Opera donated CSS technology, while Google donated it to developers. WebM provides video. This article will take you to see how HTML5 brings a new network pattern. Interested friends can pay attention to it and prepare for development. Current leaders in HTML5 development include Sencha, Adobe, appcelerator, a
    H5 Tutorial 1501 2017-07-23 11:41:47
  • Basic introduction and practice of AugularJS
    Basic introduction and practice of AugularJS
    Preface Front-end AngularJS is designed to overcome the shortcomings of HTML in building applications. (Quote from Baidu Encyclopedia) AngularJS uses a different approach. It tries to make up for the shortcomings of HTML itself in building applications. AngularJS enables browsers to recognize the new syntax by using structures we call directives. (Quote from Baidu Encyclopedia) For example
    H5 Tutorial 1373 2017-07-23 11:33:37
  • css animation production——CSS animate
    css animation production——CSS animate
    Anyone who is familiar with CSS knows that CSS can achieve many beautiful animations, especially its online functions, which can help people solve many animation effects. Today I particularly recommend an online CSS plug-in function - cssanimate. The biggest feature of this is that it allows you to easily achieve beautiful CSS3 animation effects through a graphical interface. Let's take a look at the introduction of this online tool. CSS3 animation production tool interface introduction Timeline Timeline is an important area to guide animation. Just like making frame-by-frame animation, you can adjust each
    H5 Tutorial 3175 2017-07-23 11:18:56
  • Understanding HTML5 WebSocket
    Understanding HTML5 WebSocket
    WebSocket is a protocol for full-duplex communication on a single TCP connection that HTML5 began to provide. In the WebSocket API, the browser and the server only need to perform a handshake action, and then a fast channel is formed between the browser and the server. Data can be transferred directly between the two. The browser sends a request to the server to establish a WebSocket connection through JavaScript. After the connection is established, the client and the server can directly exchange data through the TCP connection. When you get Web Socket
    H5 Tutorial 1515 2017-07-23 11:03:43
  • Introduction to examples of drawing circles on canvas in HTML5
    Introduction to examples of drawing circles on canvas in HTML5
    Use arc in canvas to draw circular patterns. The function prototype is: context.arc(x, y, radius, start angle, end angle, whether to rotate counterclockwise); so you can draw an arc by modifying the start angle and end angle.
    H5 Tutorial 2326 2017-07-22 09:56:49
  • Detailed introduction of H5 rich text editor
    Detailed introduction of H5 rich text editor
    Use the H5 global attribute contenteditable to make DOM elements and their sub-elements editable <div contenteditable id="editor"> </div> style code html,body { overflow: hidden; width: 100%; height: 100% ;}* { margin: 0; paddi
    H5 Tutorial 3421 2017-07-21 14:10:04
  • Knockoutjs+select2 personnel search function code sharing
    Knockoutjs+select2 personnel search function code sharing
     HTML: <select class="form-control PersonEmail" id="txtProjectManager" data-bind="options:{text:ICVInfo.ProjectManager,value:ICVInfo.ProjectManager},optionsText:'text',optionsValue:'val
    H5 Tutorial 2169 2017-07-21 14:07:47
  • Introduction and usage of AngularJS 'routing'
    Introduction and usage of AngularJS 'routing'
    This is some learning material from the editor. In theory, it is only for your own future learning needs, but the following content still needs to be taken seriously for reference only. Please use it with caution to learn the definition concept of "routing" in AngularJS. AngularJS has been really popular recently, and there are many Colleagues, classmates, and friends are all using it. I don’t recommend learning it. When I hear the name, I get very excited about it. I won’t explain what AngularJS is. It’s still very interesting. Here I recommend a learning website and tutorial for beginners. Although many of the tutorials in it are very simple, and many of them don’t have
    H5 Tutorial 1318 2017-07-21 14:05:30
  • Develop Vue using vue-devtools
    Develop Vue using vue-devtools
    Preface: Since Vue is data-driven, there is nothing that can be parsed by viewing the DOM structure during development and debugging. But with the help of the vue-devtools plug-in, we can easily parse and debug the data structure. 1. Download the chrome extension plug-in GitHub download address: https://github.com/vuejs/vue-devtools It is recommended to use the npm Taobao image and follow the dependency package address: http://npm.taobao.org/ command line installation
    H5 Tutorial 2486 2017-07-21 13:47:23
  • JS desktop application development tutorial
    JS desktop application development tutorial
    Preface This article is about various problems encountered in the development of nw. It is only recorded for memo and some solutions for people who have encountered the same problem. 1. The window field in package.json is invalid. Reason: The window field in package.json is only valid when the main field is *.html or an external URL. It is invalid when it is *.js. { "name": "blog", "main": &
    H5 Tutorial 5905 2017-07-21 11:18:32
  • Getting started with vue basics
    Getting started with vue basics
    Vue.js is a progressive framework for building user interfaces. Unlike other heavyweight frameworks, Vue adopts a bottom-up incremental development design. Vue's core library only focuses on the view layer. It is not only easy to get started, but also easy to integrate with third-party libraries or existing projects. On the other hand, Vue is also fully capable of powering complex single-page applications when combined with single-file components and libraries supported by the Vue ecosystem. If you know something about Angular, it will be very easy for you to learn Vue. Because on the one hand, you are interested in angu
    H5 Tutorial 1766 2017-07-21 09:16:50
  • HTML5 new knowledge
    HTML5 new knowledge
    1. The main new semantic tags in h5 are as follows: 1. header page header, page header 2. nav page navigation 3. atricle an article 4. section chapter in the article 5. aside sidebar 6. footer bottom of the page , the PC side of the footer is compatible with h5 new tags, introduce the js file <script type="text/javascript" src="//cdn.bootcss.c into the page
    H5 Tutorial 1953 2017-07-21 09:16:29
  • Let me take you to understand what is HTML5?
    Let me take you to understand what is HTML5?
    Nowadays, H5 is becoming more and more popular among enterprises or developers. It has become an indispensable tool for online promotion. I believe that many friends still don’t know what H5 is. This article will tell you about it. These are some classified questions about H5, allowing you to further learn and develop. Friends who are interested can pay attention to learn more. The first stage: the primary stage. The slideshow method means that you can see the PPT on your mobile phone. This method is actually very simple. What you need to know is that there are online template applications, which basically takes a few hours or even more. short. H5
    H5 Tutorial 1975 2017-07-20 21:00:54

Tool Recommendations

jQuery enterprise message form contact code

jQuery enterprise message form contact code is a simple and practical enterprise message form and contact us introduction page code.
form button
2024-02-29

HTML5 MP3 music box playback effects

HTML5 MP3 music box playback special effect is an mp3 music player based on HTML5 css3 to create cute music box emoticons and click the switch button.

HTML5 cool particle animation navigation menu special effects

HTML5 cool particle animation navigation menu special effect is a special effect that changes color when the navigation menu is hovered by the mouse.
Menu navigation
2024-02-29

jQuery visual form drag and drop editing code

jQuery visual form drag and drop editing code is a visual form based on jQuery and bootstrap framework.
form button
2024-02-29

Organic fruit and vegetable supplier web template Bootstrap5

An organic fruit and vegetable supplier web template-Bootstrap5
Bootstrap template
2023-02-03

Bootstrap3 multifunctional data information background management responsive web page template-Novus

Bootstrap3 multifunctional data information background management responsive web page template-Novus
backend template
2023-02-02

Real estate resource service platform web page template Bootstrap5

Real estate resource service platform web page template Bootstrap5
Bootstrap template
2023-02-02

Simple resume information web template Bootstrap4

Simple resume information web template Bootstrap4
Bootstrap template
2023-02-02

Cute summer elements vector material (EPS PNG)

This is a cute summer element vector material, including the sun, sun hat, coconut tree, bikini, airplane, watermelon, ice cream, ice cream, cold drink, swimming ring, flip-flops, pineapple, conch, shell, starfish, crab, Lemons, sunscreen, sunglasses, etc., the materials are provided in EPS and PNG formats, including JPG previews.
PNG material
2024-05-09

Four red 2023 graduation badges vector material (AI EPS PNG)

This is a red 2023 graduation badge vector material, four in total, available in AI, EPS and PNG formats, including JPG preview.
PNG material
2024-02-29

Singing bird and cart filled with flowers design spring banner vector material (AI EPS)

This is a spring banner vector material designed with singing birds and a cart full of flowers. It is available in AI and EPS formats, including JPG preview.
banner picture
2024-02-29

Golden graduation cap vector material (EPS PNG)

This is a golden graduation cap vector material, available in EPS and PNG formats, including JPG preview.
PNG material
2024-02-27

Home Decor Cleaning and Repair Service Company Website Template

Home Decoration Cleaning and Maintenance Service Company Website Template is a website template download suitable for promotional websites that provide home decoration, cleaning, maintenance and other service organizations. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2024-05-09

Fresh color personal resume guide page template

Fresh color matching personal job application resume guide page template is a personal job search resume work display guide page web template download suitable for fresh color matching style. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2024-02-29

Designer Creative Job Resume Web Template

Designer Creative Job Resume Web Template is a downloadable web template for personal job resume display suitable for various designer positions. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2024-02-28

Modern engineering construction company website template

The modern engineering and construction company website template is a downloadable website template suitable for promotion of the engineering and construction service industry. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2024-02-28
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!