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

  • HTML5 hybrid development QR code scanning and calling local camera example tutorial
    HTML5 hybrid development QR code scanning and calling local camera example tutorial
    I received a task today, saying that I need to use hybrid development and use H5 to call the local camera to scan the QR code. I have done native Android QR code scanning before, mainly by calling the zxing plug-in, which also I got a flash. But I had never been exposed to pure H5 and I was unsure, so I went home at night and started looking for solutions online. The following is my understanding and code of H5 scanning QR codes and calling local cameras. I hope it can help. Everyone.
    H5 Tutorial 8329 2017-12-30 13:43:35
  • HTML5 and Webkit realize leaf falling animation
    HTML5 and Webkit realize leaf falling animation
    What kind of animation will HTML5 and Webkit achieve together? This article will share with you a piece of example code to introduce the implementation of leaf falling animation effect based on HTML5+Webkit. Friends who need it can refer to it. I hope it can help everyone.
    H5 Tutorial 2739 2017-12-29 17:07:06
  • Example to explain H5 mobile development Ajax upload multiple Base64 format pictures to the server
    Example to explain H5 mobile development Ajax upload multiple Base64 format pictures to the server
    This article mainly introduces H5 mobile development Ajax to upload multiple Base64 format pictures to the server in detail. It has certain reference value. Interested friends can refer to it. I hope it can help everyone.
    H5 Tutorial 2480 2017-12-26 11:04:26
  • Solution to vertical centering in HTML5
    Solution to vertical centering in HTML5
    In CSS, you have to complain. You can use margin: 0 auto; to achieve horizontal centering, but margin: auto 0 cannot achieve vertical centering. This article mainly introduces the detailed solution of vertical centering in HTML5. The editor thinks it is quite good, so I will share it with you now and give it as a reference. Let’s follow the editor to take a look, I hope it can help everyone.
    H5 Tutorial 10100 2017-12-22 15:24:59
  • How to use the MUI framework in mobile HTML5
    How to use the MUI framework in mobile HTML5
    In view of many previous front-end frameworks (especially responsive layout frameworks), UI controls look too much like web pages and have no native feel. Therefore, the pursuit of native UI is also an important goal of MUI. MUI is based on the iOS platform UI and supplements some UI controls unique to the Android platform. MUI mainly has three meanings: 1. A multilingual version of Windows, a separately released computer operating system; 2. the world's most authoritative official organization for Halal certification; 3. a proper noun in mobile communication technology. This article mainly introduces the relevant information on the use of mobile HTML5 front-end framework-MUI. The editor thinks it is quite good. Now I will share it with you and give you a reference. I hope it can help everyone.
    H5 Tutorial 9662 2017-12-22 15:16:19
  • What should I do if the HTML5 virtual keyboard appears and blocks the input box?
    What should I do if the HTML5 virtual keyboard appears and blocks the input box?
    This article mainly introduces the solution to the problem that the HTML5 virtual keyboard blocks the input box. It has a very good reference value. Let’s take a look at it with the editor. I hope it can help everyone.
    H5 Tutorial 2192 2017-12-19 09:15:57
  • Summary of HTML5 localStorage knowledge points
    Summary of HTML5 localStorage knowledge points
    This article mainly shares with you a summary of HTML5 localStorage knowledge points. In HTML5, a new localStorage feature has been added. This feature is mainly used as local storage and solves the problem of insufficient cookie storage space (each item in the cookie The storage space of cookie is 4k). Generally, browsers support a size of 5M in localStorage. This will be different in localStorage in different browsers.
    H5 Tutorial 2055 2017-12-19 09:12:46
  • How to solve the problem of full screen playback in HTML5 WeChat
    How to solve the problem of full screen playback in HTML5 WeChat
    In this article, we continue to bring you new knowledge, how to solve the problem of full-screen playback in HTML5 WeChat. When playing videos under WeChat on iOS and Android phones, you will encounter many problems. For example, you need to manually click before the video will play, and the video will jump out of the WeChat box and a control bar will appear. If the video is not Tencent Video, the video will not play after the video is played. Problems such as advertising push of Tencent Video occur
    H5 Tutorial 2579 2017-12-19 09:09:25
  • 3D pressurer deserialization of Canvas in HTML5
    3D pressurer deserialization of Canvas in HTML5
    In this article, we will share with you the 3D pressurer deserialization of Canvas in HTML5. In practical applications, I think it is very convenient to be able to operate 3D scene changes by operating JSON files, especially when working as an editor. When dragging graphics elements and producing a series of changes on the graphics elements, the data can be reflected to us very intuitively. Here we have simply made a basic example for your reference.
    H5 Tutorial 1955 2017-12-18 15:58:58
  • Sample code for Html5 blinds effect_html5 tutorial tips
    Sample code for Html5 blinds effect_html5 tutorial tips
    This article mainly introduces the sample code of Html5 blinds effect. The editor thinks it is quite good. Now I will share the HTML5 source code and explanation with you, and also give you a reference. Friends who are interested in HTML5 can follow the editor to take a look.
    H5 Tutorial 2943 2017-12-16 10:42:20
  • Detailed explanation of how to evoke local app through H5
    Detailed explanation of how to evoke local app through H5
    How does H5 open or invoke a local app on a mobile phone? Looking at the answers on Baidu and Google, there are only two types: This article mainly introduces the relevant information on how to invoke a local app through H5 (browser/WebView/others). Editor I think it’s pretty good, so I’m sharing it with you now and giving it as a reference. I hope it can help everyone.
    H5 Tutorial 14823 2017-12-13 10:28:08
  • A must-see H5 meta summary for the front end
    A must-see H5 meta summary for the front end
    The <meta> element provides meta-information about the page, such as descriptions and keywords for search engines and update frequency. The <meta> tag is located at the head of the document and contains no content. The attributes of the <meta> tag define the name/value pairs associated with the document. meta is an auxiliary tag in the head area of ​​html language. This article will share with you a summary of H5 meta (a must-read for the front-end). The editor thinks it is quite good, so I will share it with you now and give it as a reference. I hope it can help everyone.
    H5 Tutorial 1844 2017-12-12 10:13:36
  • How to solve the problem of full screen playback in HTML5 WeChat
    How to solve the problem of full screen playback in HTML5 WeChat
    When playing videos under WeChat on iOS and Android phones, you will encounter many problems. For example, you need to manually click before the video will play, and the video will jump out of the WeChat box and a control bar will appear. If the video is not Tencent Video, the video will not play after the video is played. How to solve problems such as advertising push of Tencent Video? This article will share with you the solution to the full-screen problem of HTML5 WeChat playback. I hope it can help everyone.
    H5 Tutorial 2069 2017-12-11 11:58:10
  • How to fix gaps between pictures
    How to fix gaps between pictures
    In the h project, there is a gap of about 3px between several img tags. The effect is very bad. So how to solve it? The editor below will share with you the perfect solution to the gaps between images in HTML5. Friends who need it can refer to it. I hope it can help everyone.
    H5 Tutorial 3430 2017-12-11 11:53:26
  • How to implement h5 normal text box prompts
    How to implement h5 normal text box prompts
    The editor below will bring you an article on how to implement h5 input box prompts + normal text box prompts. The editor thinks it’s pretty good, so I’ll share it with you now and give it as a reference. Let’s follow the editor and take a look.
    H5 Tutorial 2068 2017-12-11 10:59:12

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