HTML5 Canvas標籤範例
隨著時代的進步，HTML的版本一直在進化，目前比較新的版本應該就是HTML5了，這次的HTML5針對許多標籤進行調整，當然也新增了一些標籤，主要的目的是希望可以將一些本來需要利用Flash才可以完成的互動頁面取而用HTML5來進行設計，這樣比較能減輕網頁的負載，但不管怎麼進步，其最重要的目的當然還是要網友能夠看到才行！
目前各家的瀏覽器對於HTML5的支援都不一，如果想要測試看看自己所使用的瀏覽器對HTML5的支援程度，可以到這個網址測試，馬老師針對目前的三款瀏覽器（IE9、Firefox6、Chrome13）來做了測試，IE9於HTML5中測試得到了以下的分數：
Firefox6於HTML5中測試得到了以下的分數：
Chrome13於HTML5中測試得到了以下的分數：
所以用以上的結果來看，目前是Google Chrome對於HTML5的支援最好，不過也只是拿了450分中的340而已，所以是否要全面改用HTML5來開發，還是應該要好好的斟酌一下，但是先了解HTML5能做到的功能，一定是沒問題的！以下就是馬老師針對HTML新增的畫布標籤製作的範例，不過因為瀏覽器支援的關係，必須使用Chrome觀賞才會是比較完整的功能喔！
範例影片：
PS：本範例的網頁所使用的圖檔為寬：800、高：600的圖檔，並將圖檔至於img的資料夾中
網頁程式碼：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Slide Show</title>
<script>
var context;
var x = 0;
var ind;
var offset;
var photos = new Array();
for(var i=1;i<=13;i++){
var im = new Image();
im.src = "img/p" + i + ".jpg";
photos.push(im);
}
function slideshow(){
context = document.getElementById('canvas').getContext('2d');
setInterval(loop,10);
}
function loop(){
x += (slider.value - x) * 0.1;
ind = Math.floor(x/800);
offset = x % 800;
context.drawImage(photos[ind], offset, 0, 800-offset, 600, 0, 0, 800-offset, 600);
context.drawImage(photos[ind+1], 0, 0, 800, 600, 800-offset, 0, 800, 600);
}
</script>
</head>
<body onLoad="slideshow()">
<canvas width="800" height="600" id="canvas"></canvas><br />
<input type="range" id="slider" style="width:800px;" min="0" max="9600" step="1" value="0">
</body>
</html>
Привет, друзья!
Парадокс, но купить диплом кандидата наук оказалось не так и сложно
csleague.ca/диплом-о-среднем-образовании-купить-н
Рады помочь!.
Привет, друзья!
Мы изготавливаем дипломы любой профессии по приятным ценам. Стоимость зависит от определенной специальности, года выпуска и ВУЗа. Стараемся поддерживать для заказчиков адекватную политику тарифов. Для нас очень важно, чтобы дипломы были доступны для большого количества наших граждан.
socialbraintech.com/story2453345/купить-диплом-вуза-цена
Добрый день!
Мы можем предложить дипломы психологов, юристов, экономистов и прочих профессий по приятным тарифам.
greenmind.cl/2024/07/07/купить-диплом-типография
Здравствуйте!
Официальная покупка диплома вуза с упрощенной программой обучения
mans-diplom.ru
You need to get upset! Really its a must to take a look past everything and get upset. Generally this will allow you to take the inititive to make things happen.
You’ll find some intriguing points in time in this post but I do not know if I see all of them center to heart. There is certainly some validity but I will take hold opinion until I look into it further. Excellent post , thanks and we want more! Added to FeedBurner too
eye doctors are specially helpful whenever you have some eye problems**
I like this web blog very much so much great information. “It’s a poor sort of memory that only works backward.” by Lewis Carroll.
Здравствуйте!
Официальная покупка диплома вуза с упрощенной программой обучения
kabtaferplus.com/купить-диплом-советы-и-рекомендации
Рады оказать помощь!.
Youre so cool! I dont suppose Ive read anything this way prior to. So nice to uncover somebody with many original applying for grants this subject. realy we appreciate you starting this up. this website can be something that is needed online, someone if we do originality. valuable job for bringing new stuff on the internet!
Hiya, have you possibly pondered to publish concerning Nintendo DSi?
i do a lot of heavy exercise twice a week and it really helped my health to be on excellent condition;
Привет, друзья!
Официальная покупка школьного аттестата с упрощенным обучением в Москве
arusak-diploms-srednee.ru/kupit-diplom-v-rostove-na-donu
Hey there! I’m at work browsing your blog from my new iphone! Just wanted to say I love reading your blog and look forward to all your posts! Carry on the outstanding work!
Congratulations on having one of the most sophisticated blogs Ive come across in some time! Its just incredible how much you can take away from something simply because of how visually beautiful it is. Youve put together a great blog space –great graphics, videos, layout. This is definitely a must-see blog.
Very nice post. I just stumbled upon your weblog and wished to say that I have truly enjoyed surfing around your blog posts. In any case I’ll be subscribing to your feed and I hope you write again soon! xrumer
Добрый день!
Где купить диплом по необходимой специальности?
http://www.marqueze.net/miembros/billyoung/profile/classic/
Привет!
Купить документ о получении высшего образования можно у нас в столице.
ast-diplomy.com/kupit-diplom-voronezh
Хорошей учебы!
Привет, друзья!
Мы изготавливаем дипломы любой профессии по доступным ценам.
anytalkworld.com/read-blog/6452_ishem-nadezhnyj-onlajn-magazin-s-diplomami
Здравствуйте!
Пошаговая инструкция по безопасной покупке диплома о высшем образовании
mans-diplom.ru
Jeden Tag stellt man sich die Frage Was Koche Ich Heute?! Zerbrechen Sie sich nicht den Kopf, besuchen Sie uns am besten direkt auf unserer Webseite uns lassen Sie sich inspirieren
I impressed, I need to say. Really not often do I encounter a blog that each educative and entertaining, and let me tell you, you have hit the nail on the head. Your concept is outstanding; the problem is something that not sufficient persons are speaking intelligently about. I’m very comfortable that I stumbled across this in my seek for one thing referring to this.
hi!,I really like your writing so a lot! proportion we keep up a correspondence more approximately your article on AOL? I require an expert on this space to resolve my problem. May be that is you! Having a look forward to look you.
Thanks for sharing your ideas. One thing is that pupils have an option between national student loan as well as a private education loan where its easier to opt for student loan consolidating debts than through the federal education loan.
My spouse and I found you from a another page plus thought I might check things out on الإØتباس الØراري وأثره على البيئة | هندسة نت . We like what I view thus now I am a fan. Look toward exploring your web site again. Incidentally what about Muammar Gaddafi breathtaking media stories what do you really think . Kudos … Irrigation System Maintenance
If only my personal content articles appeared as if this particular! That’s a enhance, btw?-I ‘m new to blog publishing as well as reading numerous blogs helps me out with my very own. Any info you could throw my way to help is very appreciated. Thanks for the great info on this particular post!
That’s why so many science fiction stories use Greek and Roman names, stories and history.
Good day! I know this is kind of off topic but I was wondering which blog platform are you using for this site? I’m getting tired of WordPress because I’ve had issues with hackers and I’m looking at alternatives for another platform. I would be fantastic if you could point me in the direction of a good platform.
Привет, друзья!
Купить диплом о высшем образовании.
itstagram.ru/read-blog/394
создание сайтов под ключ создание сайтов под ключ .