Tutorials in ‘HTML’ Category
“Now what is that “version”?”, you are probably thinking. Well it’s nothing. No really, it does absolutely nothing. You can use ?favouritesite=onlinehowto.net15 if you want. It would have the absolutely same effect.
“But what does it do?”, you are probably thinking. “This looks just like passing GET variables.” Exactly!
The browser cache uses a pretty complicated mechanism, but there is one thing that you should know for sure index.html?version=14 and index.html?version=15 are two different pages for the browsers, therefore it can’t rely on its cache, therefore it must get them again. But what happens on the server side? Well those arguments are ignored by our server and it simply supplies style.css and script.js.
Whatever language, technology, etc. you are using, you always keep a header file which is included pretty much everywhere so changing the version=<number> part after each revision is pretty easy. You can even make it a part of your site’s logic.
<input type="range" id="sliderBar" min="0" max="100" step="1" value="0"> Let’s take a quick look at the attributes for our input:
1. type – The type of input we’ll be using. In our example, it will be a range input.
3. min – The smallest possible value of our slider bar.
4. max – The maximum value of our slider bar.
5. step – The interval of the values as a percentage. For instance, if we set it to 5 it would go 5,10,15,20, etc. In this case, since it’s set at one, it will count one by one up to 100.
6. value – The default value that we’d like our slider set to.
Writing Some Code
So, let’s get started. If you’ve haven’t already added the element to your HTML page, go ahead and do so now. Also, add a <div> element below it with an id of result. You’re HTML5 page should now look like this:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title> HTML5 Slider </title>
<input type="range" id="sliderBar" min="0" max="100" step="1" value="0" onChange="showValue(this.value);"/>
<div id="result" style="height:40px;width:40px;border:1px solid #999"></div>
var result = document.getElementById(‘result’);
result.innerHTML = num;
As you can see, our showValue function takes a number for an argument, and then passes that number into our “result” <div> as HTML. Our last step is to make it so that every time our slider changes in value, it passes the value to the showValue function. To do this, we’ll add an onChange event handler. Change the range input in the HTML code so that it looks like this:
Yes, it is possible to find a good web host. Sometimes it takes a while to find one you are comfortable with. After trying several, we went with Server Intellect and have been very happy thus far. They are by far the most professional, customer service friendly and technically knowledgeable host we’ve found so far.
<input type=”range” id=”sliderBar” min=”0″ max=”100″ step=”1″ value=”0″
onChange="showValue(this.value);"/> Final Thoughts
For instance, we could say that the value is the width of an element on a page, and make something wider by using the slider, or taller, by using the value as a height attribute. We’ll make heavy use of this element in our next tutorial, so be sure you grasp what’s going on here before moving on. Read the rest of this entry »
We will continue our HTML-Tutorial (Part 1).
In this lesson you will learn more about HTML properties, titles, paragraphs, formatting, links, styles and other things.
The headings are defined by a tag to <h1>….<h6> as <h1> displayed the greatest title, but <h6> at least.
Example: Read the rest of this entry »
HTML is a language for creating Web pages
– HTML stands for Hypertext Markup Language
– HTML is not programming language
– HTML tags used so-called to describe web pages
HTML tags are keywords surrounded by angle brackets.
Tags indicate what action the browser to display.Te are two types:
each opening tag has a corresponding closing. Tags must be closed in the order in which they open. Read the rest of this entry »