Search the Community

Showing results for tags 'html5'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Calendars

  • Community Calendar

Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 127 results

  1. The example shown on fillStyle for patterns is wrong: This: var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); var img=document.getElementById("lamp"); var pat=ctx.createPattern(img,"repeat"); ctx.rect(0,0,150,100); ctx.fillStyle=pat; ctx.fill(); Should be this: var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); var img=document.getElementById("lamp"); var pat=ctx.createPattern(img,"repeat"); ctx.fillStyle=pat; ctx.fillRect(0,0,150,100); This is the only way the repeat keywords work as they should. p.s. didn't know where else to give feedback on this.
  2. html5

    I use the W3C validator religously but is there a bug in it? When I check my code it displays a "duplicate id" error. However, a duplicate id is required to connect the audio tag and javascript. I've uploaded the validator screen capture and a portion of my offending HTML5 and javascript code. Thoughts anyone... SLiM
  3. I am helping a friend who has a website, which I have made some years ago in Html and css. She would like to add a page, where users can get a logon and then be able to add some posts everyday. The posts are then visible for all the users. I have no idea about how to do this and would be very grateful, if someone could point me in the right direction.. Greetings from Lars Denmark
  4. Hello, I want to do a countdown and put it in my website. I did a countdown but I have a problem, when I launch it, the seconds are freezing they are not anymore running... So the countdown is not in realtime anymore... I have to refresh in order to see the countdown running. Here is what I did: <div id="after"> <span id="dhour"></span>:<span id="dmin"></span>:<span id="dsec"></span> </div> <div id="count2">Texte à afficher</div> <div class="numbers" id="dday" hidden="true"></div> <script> var ladate = new Date("<?php echo gmdate("Y-m-d\TH:i:s\Z");?>"); var year=ladate.getFullYear(); var month=ladate.getMonth()+1; var day=ladate.getDate(); var hour=14; var minute=20; var tz=0; var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"); function countdown(yr,m,d,hr,min){ theyear=yr;themonth=m;theday=d;thehour=hr;theminute=min; var today= new Date("<?php echo gmdate("Y-m-d\TH:i:s\Z");?>"); var todayy=today.getYear(); if (todayy < 1000) {todayy+=1900; } var todaym=today.getMonth(); var todayd=today.getDate(); var todayh=today.getHours(); var todaymin=today.getMinutes(); var todaysec=today.getSeconds(); var todaystring1=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec; var todaystring=Date.parse(todaystring1)+(tz*1000*60*60); var futurestring1=(montharray[m-1]+" "+d+", "+yr+" "+hr+":"+min); var futurestring=Date.parse(futurestring1)-(today.getTimezoneOffset()*(1000*60)); var dd=futurestring-todaystring; var dday=Math.floor(dd/(60*60*1000*24)*1); var dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1); var dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1); var dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1); if(dday<=0&&dhour<=0&&dmin<=0&&dsec<=0){ document.getElementById('count2').style.display="inline"; document.getElementById('after').style.display="none"; document.getElementById('dday').style.display="none"; document.getElementById('dhour').style.display="none"; document.getElementById('dmin').style.display="none"; document.getElementById('dsec').style.display="none"; document.getElementById('days').style.display="none"; document.getElementById('hours').style.display="none"; document.getElementById('minutes').style.display="none"; document.getElementById('seconds').style.display="none"; return;}else { document.getElementById('count2').style.display="none"; document.getElementById('dday').innerHTML=dday; document.getElementById('dhour').innerHTML=dhour; document.getElementById('dmin').innerHTML=dmin; document.getElementById('dsec').innerHTML=dsec; window.location.reload(); setTimeout("countdown(theyear,themonth,theday,thehour,theminute)",1000);}} countdown(year,month,day,hour,minute); </script> Thank you.
  5. This is my site: http://feriapixel.cl/cleanway/index.php As you can see, if you are using Chrome, it has a video background at the beginning, but when i view it with Firefox, the video doesn't appear at all. This is the HTML and javascript of my video: <video id="my-video" class="video" muted loop> <source src="videos/Clean_Way.mp4" type="video/mp4"> <source src="videos/Clean_Way.webm" type="video/webm"> </video><!-- /video --> <script> (function() { /** * Video element * @type {HTMLElement} */ var video = document.getElementById("my-video"); /** * Check if video can play, and play it */ video.addEventListener( "canplay", function() { video.play(); }); })(); </script> I need to add something for Firefox?
  6. Hi i am new for the PHP, i had the experienced before to do a login system page but what i want it is HTML and PHP file to separate i dont want PHP with HTML together to 1 file , cause professional people will more likely to use 2 file rather than 1 file easy to maintain and edit how to use the external PHP file coding without re-design whole page cause normally what i tested before was link or turn to other new page and result will come out but the design was totally gone so have any ways and suggestion to do that ... in the end, im sorry i not well in english and my knowledge of PHP still quite new , thanks you so much
  7. I Suggest Adding A Page About HTML5 Web Notifications API.
  8. hi everybody i need some help in my work it would be awesome if someone could help me . the issue is im having w horizontale scrolling website the thing is when i put some text in a specific area and when i scroll it doesnt stays in the position it moves up while i scroll to the left anyone could help me.
  9. The geolocation code gives an error Location information is unavailable. Here is the link to the code http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_geolocation_error I don't know why the error is coming. Please help me out I am heavily stuck at this point..
  10. Hi, We are in the process of building a responsive webpage. At gallery we encounter a problem where at certain resolutions (1280 x 800 for example) where the images on the gallery page do not arrange correctly. This is the test page: http://pavexparquet.pdtestare.eu/1-gallery.htm tested at this resolution gives page arrangement errors: http://quirktools.com/screenfly/#u=http%3A//pavexparquet.pdtestare.eu/1-gallery.htm&w=800&h=1280&a=24 After trying different solutions - making 4 columns instead of 6, changing text length, changing text setups - we have no idea where the problem could be. Can somebody help? Thank you. Tim
  11. Hi I cannot find a way to validate this code. marked in red error The report I get back is "expected Element p not allowed as child of element h2 in this context" <div class="content-grid"> <a href="single.html" class="b-link-stripe b-animate-go"> <img src="images/pi2.jpg" alt="rose"> <div class="b-wrapper"> <h2 class="b-animate b-from-left b-delay03 "> <span>Cool App Design</span> <p>development, mobile</p> <i> </i> </h2> </div> When I rewrite to; <div class="content-grid"> <a href="single.html" class="b-link-stripe b-animate-go"> <img src="images/pi2.jpg" alt="rose"> <div class="b-wrapper"> <h2 class="b-animate b-from-left b-delay03 "> <span>Cool App Design</span> development, mobile <i> </i> </h2> </div> The above goes through validation when published but just below the 2 lines of text is a short Line you loose this effect on the 2nd script Tried all the tags tried lo li h1 h2 3h and others to try and get it validated with to include the short line below the text. But I am stuck Thank you for your time JohnC
  12. If you use <input required> how do you stop it from allowing just spaces and how do you make sure there is a minimum entry of 8 non spaces. Thanks
  13. Hello I'm having a of a time getting my image element aligned in the top right corner of my web application and everything I try fails. at the top (head) of the page I'm using a navbar and below that I have an input group. I'm trying to float right an image (which is my school logo) but no matter what I do. I cant get it to sit nica and square where i want it. I provided a screen shoot of the problems I'm having and included is a code snippet. Can somebody please tell me WTH I'm doing wrong here? First part of code is NavBar and the second is input group. How would I set the logo by itself above the blue side panel where its supposed to be? <nav class="navbar navbar-progress"> <div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand" href="#">Existential Graph Editor</a> </div> <ul class="nav navbar-nav"> <!--li class="active"><a href="#">Home</a></li--> <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">File <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Page 1-1</a></li> <li><a href="#">Page 1-2</a></li> <li><a href="#">Page 1-3</a></li> </ul> </li> <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">Edit <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Page 1-1</a></li> <li><a href="#">Page 1-2</a></li> <li><a href="#">Page 1-3</a></li> </ul> </li> <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">Help <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Page 1-1</a></li> <li><a href="#">Page 1-2</a></li> <li><a href="#">Page 1-3</a></li> </ul> </li> <li><a href="#">About</a></li> </ul> <!--ul class="nav navbar-nav navbar-right"> <!--li><a href="#"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li> <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li--> <!--img src="../images/uahLogo.png" class="img-rounded" --> <!--/ul--> </div> </nav> <form> <!--label class="label label-primary" for="drawType">Enter Expression (e, c, p, q):</label--> <div class="input-group"> <input id="drawType" type="text" class="form-control" placeholder="Enter Expression" aria-describedby="basic-addon2"> <span class="input-group-addon" id="drawC" onclick="return OnClickDraw();">Submit</span> <span class="input-group-addon" id="clear" onclick="return clearArea();">Clear</span> <span class="input-group-addon" id="save">Save</span> <span class="uahImg"><img src="../images/uahLogo.png" height="100"> </span> </div> </form>
  14. Greetings classmates! School is in session. It seems this is mostly a CSS question. So my apologies for any re-tread. I have seen numerous posts addressing similar, but can't seem to put it together. Any help or direction to existing solutions is greatly appreciated. I am Developing an ASP.NET/MVC5 web app. It uses bootstrap 3. I am new to bootstrap and never really got into CSS more than the basics. Question: How can I change/override the a:hover of a thumbnail to include a user-defined hoverscale? So in the thumbnail.less file I see: @thumbnailHoverScale : 1.3; . . . a:hover img.thumbnail { .selected(@thumbnailHoverScale); } HoverScale is not a style attribute it seems so I can't override in standard local definition HTML style="..."!?! I do understand I can define a <style/> in local HTML to override, but again fail to comprehend exactly how. Here is my HTML: <div id="thumbnailContainer"> <div class="thumbnail-loading-spinner"></div> <ul id="thumbnails" data-bind='template: {name:"thumbnailsTemplate", foreach: thumbnails}'></ul> <div class="admin"></div> </div> and the template: <script id='thumbnailsTemplate' type="text/x-jquery-tmpl"> <li> <a href="${Url}" data-vpath="${VPath}"> <img class="thumbnail" src="${UrlThumbnail}" /> </a> </li> </script> So basically in the template, I want to override hoverscale just for just the generated thumbs. I have tried a number of style="" property definitions, then realized HoverScale is not a property. I also tried a number of variations like: ...class="thumbnail {HoverScale:2}" I think I am close on this one, possibly, but not sure how I would apply it to just the generated thumbs?? <style> a.thumbnail:hover { .selected(3) } </style> with no joy. Anyone? Thanks! Cheers!
  15. To sum things up... I'm looking for as much reviews as possible. I've been working on minestatus for the last year now. I've come across many programming roadblocks and developments to further improve the quality, user impression, user interface, and user engagement. If you guys have any ideas on how to make my site better in any of those categories that would be amazing. Thank so much! Link to site: http://minestatus.co Site Name: MineStatus Site Description: MineStatus is a new social sharing plateform I've created. It allows users to make there own profiles, upload content, display the content. You can even share your content on MineStatus to almost any other social network without flaw. I plan on making a developer site to go along with it to share my practices with everybody. Site Owner/Developer: Myself, I am the lead developer and creator of MineStatus Network Site Address: Here is the link to the site : https://minestatus.co Extra Info: Some technologies I've already integrated: Open Graph Protocol* Twittercards* *for those who don't know here is a link, Open Graph Protocol, Twittercards.
  16. Dear all: Below is how we can collapse and uncollapse a block of text suitable for FAQ or other similar effects, using HTML5. It seems it is supported by Chrome so far. The browser, however, will automatically highlight the output of the <summary> tag with a box. Is there a way of removing such box? Thanks. <!DOCTYPE html> <html> <body> <article class="collapsible_faq"> <details> <summary>Why do You Operate this Type of Business?</summary> <p>This is a feature of collapsing and uncollapsing a block of text using HTML5. It is just supported by chrome so far and Safari has started working on it. You should click on the little arrow to the left to collapse and uncollapse the text. </p> </details> <details> <summary>In Which Countries Do You Presently Work?</summary> <p>This is a feature of collapsing and uncollapsing a block of text using HTML5. It is just supported by chrome so far and Safari has starting working on it. You should click on the little arraow to the left to collapse and uncolapse the text. </p> </details> </article> </body> </html>
  17. Hi, I am doing then w3schools HTML Tutorial. I am using Mac Textedit. The text shows OK in Safari but it won't show the color. Here is the line of code: <h1 style=“color:red”>Followed by a smaller heading</h1> This shows as an H1 (very large text) but won't show the red color. Here are my Textedit settings: New Document: Plain text Open and Save: Display HTML files as HTML code instead of formatted text Document type HTML 4.01 Strict Styling (I've tried all 3 options to no avail) Encoding Unicode (UTF-8) There is no Document type option for HTML5. What do I need to do to get this working? Entire index file attached Thanks, Rick index.html
  18. I have a script developed in php. It is non-responsive. I want to convert it to a responsive website. Is there any free tool or software or step by step guide to do it? I know a little html and css, but not php. I was wondering if there is a place where I can import my existing template, apply bootstrap with one click and export. It is an open source script and can be downlaoded from phpb2b.com.
  19. <php at the top of page> <followed by an html tags, then by below php> <?php include ('./includes/footer.html'); ?> <script type= "text/javascript" src="http://code.jquery.com/jquery-2.1.4.min.js"></script> <script type= "text/javascript" src= "./js/collabsible.js"></script> For one odd page of the website I wanted to have collapsible/uncollapsible text using jQuery, so I placed the relevant scripts at the bottom of the page as seen above. It works. But in a previous communication it was stated that the ideal place for inclusion of js/jQuery scripts is before the closing tag of the body. The footer file, included before the scripts, closes the body and html tags, which means the scripts are placed even after the closed html. If scripts are placed before inclosure of the footer file, it would then be before some html tags. I cannot place them in the footer file before closure of the body tag because I need scripts in this page only while footer is also in the rest of site pages. It seems I have only two options: leaving them as seen above or make one additional footer page for this page only where I can place the scripts before body closure tag. Any help or guidance will be appreciated.
  20. I have a page that links to a video. When it loads, there is a lag in video loading, meaning the video loads but after a few seconds from loading the rest of content. I would appreciate if someone can show me how I can make the video loads exactly at the same time of everything else.
  21. Sometimes I see things that are not supported by HTML5 and other times there are things new to only html5. If I am looking at a method of installing image to a page, and there is no supported by html5 I figure, that is ok because that may be new, and I know somewhere in there "plan ahead for the future" not stick with the old. but I dont know what that matters. I figure if it is a tried and true way of "HTML" than a browser is strolling along, how would the HTML version before html5 be negatively effected. perhaps there could be a link at the html5 warnings where you could click that to see the similar method that is html5. what to do here? Not sure weather I should care about this yet. until I get the beginning "old fashion" understood better than work with new?
  22. Dear all: I have uploaded a YouTube video succssfully into my website using YouTube's iframe preferred tag. The site is coded using html5. I donot want to show any sugessted videos after the main video finishes, therefore, I did the following: clicked on share under the YouYube video; clicked embed; uncheked the 'Show suggested videos when the video finishes' check box. While the video loads and runs well, there are still videos suggested after it finishes. I would appreciate any help in resolving this issue. Best regards,
  23. hi friends,i am trying to develop a site ,as i am very much new to developing googling alone not helping me to resolve my issue.my problem now is i have horizontal menu with vertical dropdown menu.it is working perfectly with chrome but to check for the alignment when i press print screen all 4 main html pages header logo is moving towards center when i press print screen.but for sub menu this code is working perfectly fine. i doubt sub menu it is high in contents and on the menu contents are less ,is it something cos of tat.i am totally worried.can someone please help meee <!DOCTYPE html><!--using html 5--><html lang="en-US"><head><meta name="description" content="for family safety"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta http-equiv="X-UA-Compatible" content="chrome=1" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><link href="index.css" rel="stylesheet" type="text/css" /></head><body><div id="header"><!--starts of header--> <div id="site_title"> <h2>'IMPROVING HSE AT HOME' site!</h2> <img class="image_wrapper image_fr" src="images/Logo_lockup.jpg" alt="image" /> <br><br><br> </div></div> <!-- end of header --><div id="menu"> <!--starts of menu--><nav><ul><li><a href="index1.html">Home</a></li><li><a href="health.html" class="current">Health</a></li><li><a href="safety.html">Safety</a></li><li><a href="environment.html">Environment</a></li></ul></nav></div><!--end of menu--><div id="main"><!--start of main--> <div class="inner_box last"> <div class="col_w900_last"> <div class="col_w420 lp_box float_l"> <div class="inner_box"> <h2>HEALTH</h2> <P class="intro">Due to weather conditions in our Region, d healthy places to live.<br> </div> </div> <div class="col_w420 float_r"> <div class="post_box"> <div class="post_header"> <img width="400" height="400" src="images/Health_93453718.jpg" alt="Image 001" /> </div> </div> </div> </div></div> </div> <!--end of main--><div id="footer"> </div> <!-- end of footer --></body></html>
  24. hi friends,i am trying to develop a site ,as i am very much new to developing googling alone not helping me to resolve my issue.my problem now is i have horizontal menu with vertical dropdown menu.it is working perfectly with chrome and IE 11 BROWSERS, to check for the alignment when i press print screen all 4 main html pages header logo is moving towards center using CHROME but alignment is perfect when using IE.FOR sub menu alignment works fine for chrome and IE. i doubt sub menu it is high in contents and on the menu contents are less ,is it something cos of tat.i am totally worried.can someone please help meee
  25. hi friends, my webpage works fine with chrome but when i press the print screen(ctrl+p) header alignment changes. i tried to correct in many ways nothing seems to work. the twist it works fine for all sub menu the alignment problem is only with main main pages(my logo is on right corner it is moving towards center when print) <!DOCTYPE html><!--using html 5--><html lang="en-US"><head><meta name="description" content="for family safety"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta http-equiv="X-UA-Compatible" content="chrome=1" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><link href="index.css" rel="stylesheet" type="text/css" /></head><body><div id="header"><!--starts of header--> <div id="site_title"> <h2>'IMPROVING HSE AT HOME' site!</h2> <img class="image_wrapper image_fr" src="images/Logo_lockup.jpg" alt="image" /> <br><br><br> </div></div> <!-- end of header --><div id="menu"> <!--starts of menu--><nav><ul><li><a href="index1.html">Home</a></li><li><a href="health.html" class="current">Health</a></li><li><a href="safety.html">Safety</a></li><li><a href="environment.html">Environment</a></li></ul></nav></div><!--end of menu--><div id="main"><!--start of main--> <div class="inner_box last"> <div class="col_w900_last"> <div class="col_w420 lp_box float_l"> <div class="inner_box"> <h2>HEALTH</h2> <P class="intro">Due to weather conditions in our Region, d healthy places to live.<br> </div> </div> <div class="col_w420 float_r"> <div class="post_box"> <div class="post_header"> <img width="400" height="400" src="images/Health_93453718.jpg" alt="Image 001" /> </div> </div> </div> </div></div> </div> <!--end of main--><div id="footer"> </div> <!-- end of footer --></body></html> body { margin: 0; padding: 0; color: #fff; font-family: Arial; font-size: 14px; line-height: 1.5em; background-color: #ccc; background-position: top}h1, h3, h4, h5, h6 { color: #fff; font-weight: normal }h1 { font-size: 34px; margin: 0 0 30px 0; padding: 5px 0; }h2 { font-size: 26px; margin: 0 0 20px 0; padding: 0;line-height: 1.1em; color:rgb(255,221,0); }.cleaner { clear: both }.h10 { height: 10px }.h20 { height: 20px }.h30 { height: 30px }.h40 { height: 40px }.h50 { height: 50px }.h60 { height: 60px }.float_l { float: left }.float_r { float: right }.image_wrapper { display: inline-block; padding: 0px; background: #000; margin-bottom: 5px; }.image_fr {position: absolute;top: 0;right: 0%; float: right;height:100px;width:220px; margin: 0px 0px 15px 15px; }#header { clear:both; height:110px; margin:0 auto; background-image:url(images/86930033.JPG); }#site_title { }#site_title h2 { margin: 0; text-align:center; padding-top: 30px; font-size:28px; color:#000;text-shadow:2px 2px #0093d0; }#menu { width:960px; position:relative; margin: 0px auto; background:#0093d0;}nav { position:relative;}#main { clear: both; width: 900px; margin: 0 auto; padding: 45px 30px 0; background-color: #54534a; overflow:hidden;}.col_w900 { width: 900px; padding-bottom: 30px }.col_w420 { width: 420px }.col_allw280 { float: left; width: 280px; margin-right: 30px }.col_w900_last { margin: 0; background: none; }.inner_box { margin-bottom: 50px; padding-bottom: 50px; }.last { margin: 0; padding: 0; border: none }.post_box { clear: both; margin-bottom: 30px }.post_box .post_header { padding: 10px 0; border: 1px; border-left: none; border-right: none; margin-bottom: 15px }.#footer { clear: both; width:900px; /* padding: 25px 30px 0; */ padding: 45px 30px 15px; margin: 0 auto; background-color:#0093d0; text-align: center; color: #fff; }