9 HTML 5 Advanced PHP XML HTML 5
- Slides: 11
Μάθημα 9 Λίγο απ’ όλα! HTML 5 Advanced PHP XML
HTML 5 input Τα νέα input types είναι: • color • datetime-local • email • month • number • range • time • url • week Select color: <input type="color" name=“mycolor"> Dep date: <input type="date" name=“Dday"> Ticket (date and time): <input type="datetime" name=“Tickdaytime"> My E-mail: <input type="email" name=“Myemail"> Choose (between 1 and 10): <input type="number" name=“The. Number” min=“ 2" max=“ 10“ step=“ 2” value=“ 2”> <input type="range" name="points" min="1" max="10"> Add your homepage: <input type="url" name="homepage">
HTML 5 Canvas HTML 5 <canvas> είναι για να μπορούμε να σχεδιάζουμε γραφικά σε runtime μέσω scripting (Java. Script). Δημιουργία <canvas id="my. Canvas" width="200" height="100" style="border: 1 px solid #000000; "> < /canvas> Ζωγραφική με script <script> var canv = document. get. Element. By. Id(“page. Canvas"); var Ccοntext = canv. get. Context("2 d"); Ccοntext. fill. Style = "#000000"; Ccοntext. fill. Rect(0, 0, 100, 85); //Πάνω αριστερή γωνία είναι το (0, 0) < /script>
HTML 5 Canvas var c = document. get. Element. By. Id(“The. Canvas"); var Contxt= c. get. Context("2 d"); Contxt. move. To(0, 0); Contxt. line. To(100, 100); Contxt. stroke(); var c = document. get. Element. By. Id(“The. Canvas"); var Contxt = c. get. Context("2 d"); Contxt. font = "30 px Arial"; Contxt. fill. Text("Hello World", 10, 50); var c = document. get. Element. By. Id("my. Canvas"); var ctx = c. get. Context("2 d"); Contxt. begin. Path(); Contxt. arc(100, 40, 0, 2*Math. PI); // circle Contxt. stroke();
HTML 5 Canvas example <!DOCTYPE html> <body> <img id=“image. ID" src=“test. jpg" width="200" height="250"> <canvas id=“test. Canvas" width="250" height=“ 250”> Your browser does not support the HTML 5 canvas tag. </canvas> <script> var c=document. get. Element. By. Id(“test. Canvas"); var ctx=c. get. Context("2 d"); var img=document. get. Element. By. Id(“image. ID"); ctx. draw. Image(img, 0, 0); </script> </body> </html>
HTML 5 Video/audio Video Formats MP 4 video/mp 4 Web. M video/webm Ogg video/ogg Audio Formats MP 3 audio/mpeg Ogg audio/ogg Wav audio/wav <video width="320" height="240" controls> <source src="movie. mp 4" type="video/mp 4"> Your browser does not support the HTML 5 video tag. < /video> <audio controls> <source src="horse. mp 3" type="audio/mpeg"> Your browser does not support the HTML 5 audio tag. </audio>
<? php function sum($x, $y) { $s=$x+$y; return $s; } PHP Functions echo “ 1 + 1= ". sum(1, 1). " "; echo “ 2 + 2 = ". Sum(2, 2). " "; echo “ 3 + 3 = ". Sum(3, 3); ? > <? php function write. Msg() { echo “This is a test Message!"; } write. Msg(); // call the function ? >
PHP XML-DOM offer. xml <? xml version="1. 0" encoding="UTF-8"? > <offer> < header>50% Discount on rooms</header> <body> Today all rooms 50% down</body> < /offer> <? php $xml. Doc = new DOMDocument(); $xml. Doc->load(“offer. xml"); print $xml. Doc->save. XML(); ? > save. XML puts the internal XML document into a string, so we can output it <? php $xml. Doc = new DOMDocument(); $xml. Doc->load(“offer. xml"); $x = $xml. Doc->document. Element; foreach ($x->child. Nodes AS $item) { print $item->node. Name. " = ". $item-> node. Value. " "; } ? >
Παράδειγμα include Έστω σελίδα footer. php <? php echo "<p> Author: Your Name</p>"; ? > Και σελίδα test. php <html> < body> <h 1> This is a test </h 1> <? php include 'footer. php'; ? > < /body> < /html>.