Jump to content

Search the Community

Showing results for tags 'html5'.

  • 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

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

  1. https://www.w3schools.com/howto/howto_css_flip_box.asp in the first example, I would like the "Front Side" wording to be in center of the box, not the top. Thank you!
  2. Hello Community, what is the difference between <a href="https://www.w3schools.com" referrerpolicy="no-referrer"> and <a href="https://www.w3schools.com" rel="noreferrer"> It seems to me saying the same thing twice over.
  3. Hello, I appreciate nice html5 layout examples, e.g. https://www.w3schools.com/html/html_layout.asp (source code with new html tags like header, section, nav and others: https://www.w3schools.com/html/tryit.asp?filename=tryhtml_layout_float ), but in many examples in css section are still old div tags with classes like .header and so on, e.g. here: https://www.w3schools.com/css/css_website_layout.asp or here https://www.w3schools.com/howto/howto_css_style_header.asp . I think this could be change to newer html5 code, for example this code with divs: https://www.w3schools.com/css/tryit.asp?filename=trycss_website_layout_grid to code in attachment, which is easier (I hope :-) css-layout.html
  4. function hideElements() { document.getElementById('div1').style.display = "block"; document.getElementById('div2').style.display = "none"; document.getElementById('div3').style.display = "none"; document.getElementById('div4').style.display = "none"; document.getElementById('div5').style.display = "none"; hideScreenElements(); } How do I get the div that I'm hiding to stop taking up space when style.display = none? It's throwing off the vertical placement of a video beneath the divs that are set to none. Thank you
  5. When I step through this, it never changes to black. It just stays red. <body onload = "hideQuote0();"> <script> function hideQuote0() { document.getElementById("span0").color = "rgb(255,0,0)"; setTimeout(hideQuote1(), 3000); } function hideQuote1() { document.getElementById("span0").color = "rgb(128,0,0)"; setTimeout(hideQuote2(), 3000); } function hideQuote2() { document.getElementById("span0").color = "rgb(0,0,0)"; } </script> <div id="div0" style.display = "block";> <span id="span0" color: rgb(0,0,0);> QUOTE GOES HERE </span><br><br> </div> ... </body> Thank you very much
  6. Hi, this is my first post, Hope everyone are fine. I am new in HTML,JavaScript, CSS. I am trying to make a Spin the wheel for my site. so up to confirm dialog section, it's working okay but I need when the user click ok button in confirm box the user redirect to next page or another page or to an another site. I am unable to create it, plz. help. me (However in this section, if i able to display a popup type something, where a link button and some text can be appeared, it will also solve my problem) function confirmPrize(indicatedSegment) { // Do basic alert of the segment text. You would probably want to do something more interesting with this information. confirm("Hey,you won " + indicatedSegment.text + ' click on the link and read carefully'); $('a').on('click', function() { if ( this.host != window.somewhere.com ) { if ( window.confirm() ) { // They clicked Yes console.log('you chose to Bye.'); } else { // They clicked no console.log('you chose to stay here.'); return false } } }); } </script> </body> </html>
  7. Hello, I would be very appreciative for any advice. I want to create a container on a Web page which inserts a clickable image to a variable URL, depending on the country the visitor is from. For example if a visitor is from China then the container imports a specific image with clickable URL from a repository of images and associated URLs. A random selection is fine, but for now I just want to get it working with a single clickable image. rhsnk you !
  8. Hello Everyone Good Evening I'm following your w3.css tutorial but I need your help. My questions are: - How do I centralize the Work Experience, Education and Skills sections in the middle of the browser window? - How do you fix datetime on the same level as the timebar, ie on the same line as the timebar? I would appreciate your support, please. https://codepen.io/Quencyjones79/pen/eYRWgOm
  9. I want to make a RPG game that can be run in a browser. The goal of the post is to see if I can get other developers to help. I know HTML and CSS but don't know JavaScript, which is a big part of game. ( I am learning it now ) I want the graphics to look similar to pixel dungeon. The people who sign up will get equity of the game. While this game is to be made for fun it could also make money. For more details about the game details ( such as classes, levels, etc. ) contact me.
  10. I've seen this (and similar) code used to apply an SVG filter to an image. How do I use this code to apply an SVG filter to a canvas? The canvas' content may change often. <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <filter id="darkGreen"> <feColorMatrix type="matrix" values="0 0 0 0 0 0 0.5 0 0 0 0 0 0 0 0 0 0 0 0 1" /> </filter> </defs> <image xlink:href="(url to image)" width="" height="" filter="url(#darkGreen)" /> </svg> Thank you
  11. Hi everyone!😃 I have done the html, css and doing the JavaScript tutorial. I want to start consolidating my basic knowledge by developing websites. But where do I start? I want to build a portfolio. But I can't seem to move forward! To start the web building, should I follow the section headed 'Web Building?' Thanks, Jayne🤠
  12. I do not know how to make cell phone browsers choose the smaller image, and the laptops/desktops choose the bigger image, while their resolutions are the same. I have the following script: <img sizes="(max-width: 479px) 479px, (max-width: 991px) 991px, 1400px" srcset="media/img/small.webp 479w, media/img/medium.webp 991w, media/img/big.webp 1400w" src="media/img/default.png"> From the above script, when the cell phone's resolution is, let's say 1080 x 1920 pixels, then the browser will choose big.webp. How to make the cell phone's browser choose small.webp? Thank you
  13. 0 I do not know how to make cell phone browsers choose the smaller image, and the laptops/desktops choose the bigger image, while their resolutions are the same. I have the following script: <img sizes="(max-width: 479px) 479px, (max-width: 991px) 991px, 1400px" srcset="media/img/small.webp 479w, media/img/medium.webp 991w, media/img/big.webp 1400w" src="media/img/default.png"> From the above script, when the cell phone's resolution is, let's say 1080 x 1920 pixels, then the browser will choose big.webp. How to make the cell phone's browser choose small.webp? Thank you
  14. https://www.w3schools.com/howto/howto_custom_select.asp The link above is a custom select dropdown. I'm trying to get each item in the dropdown go to a link. I've tried using; <body> Please select city : <select name="select-city" onchange="location = this.value;"> <option value="">Select-City</option> <option value="https://en.wikipedia.org/wiki/New_Delhi">New Delhi</option> <option value="https://en.wikipedia.org/wiki/New_York">New York</option> <option value="https://en.wikipedia.org/wiki/Bern">Bern</option> <option value="https://en.wikipedia.org/wiki/Beijing">Beijing</option> </select> </body> And this, <select name="formal" onchange="javascript:handleSelect(this)"> <option value="home.com">Home</option> <option value="https://www.Facebook.com">Contact</option> </select> <script type="text/javascript"> function handleSelect(elm) { window.location = elm.value; } </script>
  15. Hello guys, I´m currently creating a website and have to use some kind of a switch button (in iOS-Style). I already implemented the switch button, however I want the user to switch with the button between two upcoming photo galleries. Because documentation in the www is lacking, I would need your support. Because I´m pretty unexperienced in website coding, I used the W3school switch button (https://www.w3schools.com/howto/howto_css_switch.asp) I hope you could help and I´m sorry for being such unexperienced but having high demands.
  16. I'm trying to write an article on my web site about special relativity. Does HTML5 provide a way to render one over the square root of an expression on a web page? The expression has superscripts and subscripts, which I know how to do. Thank you for your help. Jim Adrian
  17. I'd like my video to start playing automatically when the page is launched without sound just like on this page: [LINK REMOVED]. I've tried any possible jQuery/javascript/CSS option I could find online but I always end up with Google error that's blocking the video from autoplay unless there was an interaction. How did they do it in the link above?
  18. I have created a simple Web Page having a HTML form for the user's name and age details. I had HTML file linked with an asp file that displayed the user's name and age using action attribute xxx.asp. Upon running the code, first web page shows me a form to fill, let it be my page 1 and after finishing the form and clicking on submit button I am redirected to a new web page, consider it as page 2. Now What happens to page 1 after the submit button is clicked, is it stored somewhere or the memory space is freed for page 1. Wanted to know how page 1 works internally.
  19. I'm going through the HTML game module, and I found " var myleft = this.x; var myright = this.x + (this.width); var mytop = this.y; var mybottom = this.y + (this.height); " In https://www.w3schools.com/graphics/game_obstacles.asp Can someone please explain what points are myleft, myrightm mytop and mybottom on the component? I'm confused because aren't myleft and mytop the same point on the component? Please help. Thanks, Prakhar
  20. If somebody can explain this code like what does what il swish 15 euros. Here is the code its for my nav bar but i have a hard time explaining what everything does. <style> .dropbtn { background-color:black; color: white; padding: 16px; font-size: 16px; border: none; } .dropdown { left:77.005px; position: relative; display: inline-block; } .dropdown-content { display: none; position: absolute; background-color: lightgrey; min-width: 200px; z-index: 1; } .dropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; } .dropdown-content a:hover {background-color: white;} .dropdown:hover .dropdown-content {display: block;} .dropdown:hover .dropbtn {background-color: grey;} </style> </head> <div class="dropdown"> <button class="dropbtn">meny</button> <div class="dropdown-content"> <a href="La carte/la carte.html">A la carte matsedel</a> <a href="Veckomatsedel/veckomatsedel.html">veckomatsedel</a> </div> </div> <style> <div class="dropdown"> <button class="dropbtn" onclick="window.location.href = 'Kontakt/Kontakt.html';">kontakt</button> <div class="dropdown-content"> </div> </div>
  21. I'm building a web page, and started with a simple layout: there is a banner and a menu at the top, and the welcome page after it. People may then select an item from the menu at the top or the image links at the main page, and go to other subpages. But the idea is that those subpages should be loaded in the area below the menu, the menu itself and the banner should remain in place, not reloaded each time the visitor navigates around. I have seen some instructions but they always rely in frames or frame-related tags. It has been made abundantly clear that those are not compatible with HTML5 and have many drawbacks, but then, which is the modern way to do that? Note that most or all major pages in internet do this regardless of their format (limit the navigation to a part of the page, while keeping links at the top, bottom, left or right in their place), so I'm sure that I'm not asking about some outdated idea. The W3Schools page itself, after all, does this.
  22. What would be the most efficient way to code on wordpress? Should I write directly on the platform or copy it from an editor? I am having a hard time on WP specially when adding tables as the code is all messed up (without spaces or lines). If you use WP, please help! Thank you, Damian
  23. <!DOCTYPE html> <html lang = "en"> <!--This is my first comment in my index page--> <head> <meta charset="utf-8"> <link rel="stylesheet" href="greentea.css"> <a href= "greentea.html"></a> </head> <header> <h1>Teaz Nuts</h1> </header> <!--This is the body of my page--> <body> <nav> <ul> <li><a href= "greentea.html"> Home </a></li> <li><a href="about.html">Login</a></li> <li><a href="Product.html">Product</a> </li> <li><a href="New User Signup.html">New User Signup</a></li> </ul> </nav> <main> <div class = "hippiegirl"> <image src = "hippiegirl.jpg" alt = "tranquility"></image> </div> <p>The properties of green tea are many and varied. Especially during an epidemic<br> we all need to be aware of what tea can do for us. Along with its antibiotic properties, it also<br> can cleanse the spirit and wash away our tensions. </p> </main> <footer> <br>&copy; <a href="mailto:jackcole861@gmail.com">Click to email Jack Cole</a> </footer> </body> </html> This is my css .hippiegirl { position:absolute; left:0; top:0; width:400%; height:auto; opacity:0.6; } body{ background-color: lightgreen; } ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333; } li { float: left; } li a { display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none; } /* Change the link color to #111 (black) on hover */ li a:hover { background-color: #111; }
  24. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title> </title> <link href="css/bootstrap-4.0.0.css" rel="stylesheet" type="text/css"> <link href="css/styles.css" rel="stylesheet" type="text/css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script> $(document).ready(function() { var id = 1; $("#butsend").click(function() { var newid = id++; $("#table1").append('<tr valign="top" id="'+newid+'">\n\ <td width="100px" >' + newid + '</td>\n\ <td width="100px" class="patid'+newid+'">' + $("#patid").val() + '</td>\n\ <td width="100px" class="test_code'+newid+'">' + $("#test_code").val() + '</td>\n\ <td width="100px" class="test_name'+newid+'">' + $("#test_name").val() + '</td>\n\ <td width="100px" id="generalprice" class="generalprice'+newid+'">' + $("#generalprice").val() + '</td>\n\ <td width="100px" id=quantity class="quantity'+newid+'">' + $("#quantity").val() + '</td>\n\ <td width="100px" id="qntytolprices" class="totalprices'+newid+'">' + $("#totalprices").val() + '</td>\n\ <td width="100px"><a href="javascript:void(0);" class="remCF">Remove</a></td>\n\ </tr>'); }); $("#table1").on('click', '.remCF', function() { $(this).parent().parent().remove(); $('#table1 tbody tr').each(function(id){ $($(this).find('td')[0]).html(id++); }); }); $("#butsave").click(function() { var lastRowId = $('#table1 tr:last').attr("id"); var test_code = new Array(); var test_name = new Array(); var generalprice = new Array(); var quantity = new Array(); var totalprices = new Array(); var patid = new Array(); for ( var i = 1; i <= lastRowId; i++) { patid.push($("#"+i+" .patid"+i).html()); test_code.push($("#"+i+" .test_code"+i).html()); test_name.push($("#"+i+" .test_name"+i).html()); generalprice.push($("#"+i+" .generalprice"+i).html()); quantity.push($("#"+i+" .quantity"+i).html()); totalprices.push($("#"+i+" .totalprices"+i).html()); totalprice.push($("#"+i+" .totalprice"+i).html()); } }); }); </script> <script> $(".qtol2,.qtol1").keyup(function() { $('.qtol3').val($('.qtol1').val() * $('.qtol2').val()); }); </script> </head> <body> <div class="form-group"> <form> <input name="patid" type="text" id="patid" placeholder="patid" value=""> <div class="container" id="multiple"> <input name="test_code" type="text" id="test_code" placeholder="code" value=""> <input name="test_name" type="text" id="test_name" placeholder="Item Name" value=""> <input class="qtol1" name="generalprice" type="text" id="generalprice" placeholder="general price"> <input class="qtol2" name="quantity" type="text" id="quantity" value="1" onClick="calc()" placeholder="quantity"> <input class="qtol3" name="totalprices" type="text" id="totalprices" placeholder="total prices"> <input name="send" type="button" id="butsend" class="add-row" value="Add Row"> </div> <div> <input name="save" type="button" class="btn btn-primary" value="Save to database" id="butsave"> </div> <table id="table1" name="table1" class="table table-bordered"> <tbody> <thead> <tr> <th>Serial no.</th> <th>ID</th> <th>Test code</th> <th>Test name</th> <th>General price</th> <th>Quantity</th> <th>Total prices</th> <th>Action</th> </tr> </thead> </tbody> <tfoot> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td>Total:</td> <td ><input id="subtotal" type="text"></td> <td> </td> </tr> </tfoot> </table> </form> </div> </body> </html>
×
×
  • Create New...