Bootstrap breadcrumbs

Breadcrumbs are a critical piece of website navigation and bootstrap makes it very simple to add beautiful breadcrumbs. <!DOCTYPE html> <html> <head> <title>Bootstrap 3 Breadcrumbs</title> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <style type="text/css"> #w3m, h1{ margin: 20px; padding: 15px; } </style> </head> <body> <h1> BreadCrumbs in Bootstrap </h1> <div id="w3m"> <ul […]
Continue reading…

Enjoyed this post? Share it!

 
 

Bootstrap Nav Tabs

Below is an example of how to render the bootstrap nav tabs with icons per tab. <!DOCTYPE html> <html> <head> <title>Bootstrap Nav and Nav Tabs</title> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <style type="text/css"> .w3m{ margin: 25px 50px 75px 100px; } </style> </head> <body> <div class="w3m"> <ul class="nav nav-tabs"> <li class="active"><a href="#"> […]
Continue reading…

Enjoyed this post? Share it!

 
 

websockets bufferedAmount example

// 10k max buffer size. var THRESHOLD = 10240;   // Create a New WebSocket connection var ws = new WebSocket("ws://w3mentor.com");   // Listen for the opening event ws.onopen = function () {   // Attempt to send update every second. setInterval( function() { // Send only if the buffer is not full if (ws.bufferedAmount […]
Continue reading…

Enjoyed this post? Share it!

 
 

Handling Media Events in HTML 5 audio and video

Example which allows to play the given video: <!DOCTYPE HTML> <head> <script type="text/javascript"> function PlayVideo(){ var v = document.getElementsByTagName("video")[0]; v.play(); } </script> </head> <html> <body> <form> <video width="300" height="200" src="/html5/foo.mp4"> Your browser does not support the <video> element. </video> <input type="button" onclick="PlayVideo();" value="Play"/> </form> </body> </html> The HTML5 audio and video tag can have a […]
Continue reading…

Enjoyed this post? Share it!

 
 

Audio Attribute Specification in HTML 5

The HTML5 audio tag can have a number of attributes to control the look and feel and various functionalities of the control: Attribute Description autoplay This boolean attribute if specified, the audio will automatically begin to play back as soon as it can do so without stopping to finish loading the data. autobuffer This boolean […]
Continue reading…

Enjoyed this post? Share it!

 
 

Embedding Audio in HTML 5 Pages

HTML5 supports audio tag which is used to embed sound content in an HTML or XHTML document as follows. <audio src="foo.wav" controls autoplay> Your browser does not support the <audio> element. </audio> The current HTML5 draft specification does not specify which audio formats browsers should support in the audio tag. But most commonly used audio […]
Continue reading…

Enjoyed this post? Share it!

 
 

Video Attribute Specification in HTML 5

The HTML5 video tag can have a number of attributes to control the look and feel and various functionalities of the control: Attribute Description autoplay This boolean attribute if specified, the video will automatically begin to play back as soon as it can do so without stopping to finish loading the data. autobuffer This boolean […]
Continue reading…

Enjoyed this post? Share it!

 
 

Introduction to XHTML

Extensible hypertext markup language, XHTML, is the basic language of the web page. Writing XHTML is not programming. XHTML is not a procedural language. Writing XHTML is more like word processing than programming. Like word processing, there are two approaches to write an XHTML page. There are WYSIWYG (What You See Is What You Get) […]
Continue reading…

Enjoyed this post? Share it!

 
 

Displaying images using img tag in HTML

The IMG element is used to incorporate images into an HTML document. The common attributes used are SRC, ALT (required by HTML 4), WIDTH, and HEIGHT (recommended for practical reasons). IMG is an inline element, and can be used anywhere text can be used. Images can be put into a sentence, in a table cell, […]
Continue reading…

Enjoyed this post? Share it!

 
 

Headings in HTML pages

The heading elements of an HTML document organize the content in a way similar to an outline. There are six levels of headings, which correspond to the levels of an outline. The top (most important) level heading uses the H1 tag, and the lowest (least important) supported level uses the H6 tag. Typically, browsers render […]
Continue reading…

Enjoyed this post? Share it!

 
 

Creating a HTML page

Development of HTML pages can start with a basic template, which includes the framework elements. Specific information can then be added to the page as needed. An HTML page begins with a Document Type Definition (DTD), which identifies the specification against which the page should be interpreted. This is followed by the page itself, embedded […]
Continue reading…

Enjoyed this post? Share it!

 
 

Empty elements in HTML

Tags for empty elements do not occur in pairs. They consist of the keyword enclosed in “angle brackets.” No page text is contained within them. For example, the horizontal rule tag, keyword HR, puts a horizontal line on the page. Example: <P> This is a paragraph, which will be formatted into left justified lines to […]
Continue reading…

Enjoyed this post? Share it!

 
 

Introduction to HTML

Hypertext markup language, HTML, is the basic language of the web page. Writing HTML is not programming. HTML is not a procedural language. Writing HTML is more like word processing than programming. Like word processing, there are two approaches to write an HTML page. There are WYSIWYG (What You See Is What You Get) editors […]
Continue reading…

Enjoyed this post? Share it!