Web Development: HTML5

September 8, 2018

HTML5 elements for media content!

Below are list of all new HTML5 elements for media content.

<audio>
- Ites define sound content. Its (<audio>) used to add audio content to a Web Page.
Syntax - <audio src="define path" type="auto/mpeg" ></audio>

<video>
- Video eletemt is same basic syntax of audio element. Its also used to add video content to a Web Page.
Syntax - <video src="define path" type="video/mp4" ></video>

<embed>
- Its can be define container for non - HTML application

<source>
- Used for multiple media resources for media elements like <audio> and <video>
Syntax - <source controls>
<video src="define path" type="video/mp4" ></video>
</source>
<track>
- Track eletemt used as a child for <audio> and <video> element
Syntax - <video controls>
<track kind="subtitle" src="" srclang="en" label="English">
</video>

July 18, 2016

How to view web site in fullscreen using HTML5 and jQuery?

Please follow below step and refer this link for more help.

1: First include following two JS in header part between <head> tab,

2: HTML code for just link

<a href="javascript:;" class="fullscreen "><i class="fa fa-arrows-alt"></i> View Fullscreen</a>

3: jQuery API code

$(".fullscreen-toggle").on("click", function() {

    document.fullScreenElement && null !== document.fullScreenElement ||

    !document.mozFullScreen && !document.webkitIsFullScreen ?

    document.documentElement.requestFullScreen ?

    document.documentElement.requestFullScreen() :

    document.documentElement.mozRequestFullScreen ?

    document.documentElement.mozRequestFullScreen() :

    document.documentElement.webkitRequestFullScreen &&

    document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT):

    document.cancelFullScreen ? document.cancelFullScreen() :

    document.mozCancelFullScreen ? document.mozCancelFullScreen() :

    document.webkitCancelFullScreen && document.webkitCancelFullScreen()

});

For more details click Here!

Demo

Enjoy!

Web Development

September 8, 2018

HTML5 elements for media content!

July 18, 2016

How to view web site in fullscreen using HTML5 and jQuery?

The Future of Technology: Emerging Trends to Watch in 2025

Followers