Jump to content

Search the Community

Showing results for tags 'HTML'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


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


  • Community Calendar

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start





Website URL








Found 769 results

  1. Hi, I've used this code in my website. I want "Hide --> Show", but the explenation automatic do "Show --> Hide". Is there a way to flip the code?
  2. Hello frns, i learnt how to get the gps coordinates from w3school tutorials but a small question how to alter the user if he blocks the gps access request through code <script> var x = document.getElementById("gpsloc"); function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition, showError); } else { x.value = "Geolocation is not supported by this device."; } } function showPosition(position) { x.value = position.coords.latitude + "," + position.coords.longitude; } function showError(error) { switch(error.code) { case error.PERMISSION_DENIED: x.value = "User denied the request for Geolocation." break; case error.POSITION_UNAVAILABLE: x.value = "Location information is unavailable." break; case error.TIMEOUT: x.value = "The request to get user location timed out." break; case error.UNKNOWN_ERROR: x.value = "An unknown error occurred." break; } } </script> what i want to make is page should check the state of permission and if permission is denied page should alert or keep re-request permission to allow please assist
  3. Please anyone help to make the Table in HTML.
  4. Hello, I have different overlay images on iframe vimeo videos. As I have several embeded vimeo videos and overlay images, I would like to add a script so that when I click on one overlay image it doesn't apply to all the overlay images on the page. Here's the code, thanks <!DOCTYPE html> <html> <head> <style> #vid { display: none; margin-top: -365px; z-index:1; } #vid2 { display: none; margin-top: -365px; z-index:1; } #iframe_id { pointer-events: none; } </style> </head> <body> <img src="https://www.ebnerfilm.com/wp-content/uploads/2019/08/LV_INTERVIEW_GIF_PLAY.gif" class="gliphy" onclick="myFunction()"> <div id="vid"> <iframe src="https://player.vimeo.com/video/353777739" width="640" height="360" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe> </div> <img src="https://www.ebnerfilm.com/wp-content/uploads/2019/08/LOIS_LANE_GIF_PLAY.gif" class="gliphy" onclick="myFunction()"> <div id="vid2"> <iframe src="https://player.vimeo.com/video/196409842" width="640" height="360" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe> </div> <script> function myFunction() { document.getElementById("vid").style.display = "block"; document.getElementById("vid2").style.display = "block"; } $('#iframe_id_wrapper').click(function() { //run function that records clicks }); </script> </body> </html>
  5. alexdelrio

    HTML/CSS Help

    Hi, I am new to coding and I am working on creating a new nav bar for my company site. So far, it's coming out decently well but I am running into an issue and was hoping someone could help me. I can't seem to center my dropdown portion of the nav bar on mobile. Any help would be greatly appreciated! HTML: <html> <head> <link href="[https://fonts.googleapis.com/css?family=Montserrat:600&display=swap](https://fonts.googleapis.com/css?family=Montserrat:600&display=swap)" rel="stylesheet"> </head> <body> <span class="navbar-toggle" id="js-navbar-toggle"> <i class="fas fa-bars"></i> </span> <a href="[https://theretirementinstructor.com](https://theretirementinstructor.com)"><img src="[https://i.imgur.com/MNW22YI.png](https://i.imgur.com/MNW22YI.png)" class="logo" alt="AFF-Logo"></a> <ul class="main-nav" id="js-menu"> <li> <a href="[https://theretirementinstructor.com/about/](https://theretirementinstructor.com/about/)" class="nav-links">About</a> </li> <li> <a href="[https://theretirementinstructor.com/attend-an-event/](https://theretirementinstructor.com/attend-an-event/)" class="nav-links">Events</a> </li> <li> <a href="[https://theretirementinstructor.com/resources/](https://theretirementinstructor.com/resources/)" class="nav-links">Resources</a> </li> <a href="[https://theretirementinstructor.com/financial-services/](https://theretirementinstructor.com/financial-services/)" class="nav-links">Financial Services</a> </li> <a href="#" class="nav-links">Client Access</a> <ul> <li> <a href="[https://www.rightcapital.com/login?cobrand=soCBPCxAN09bwRUnzkT-Sg&type=client](https://www.rightcapital.com/login?cobrand=soCBPCxAN09bwRUnzkT-Sg&type=client)">Retirement Plan</a></li> <li> <a href="[https://www.advisorclient.com/login](https://www.advisorclient.com/login)">TD Ameritrade</a></li> <li> <a href="[https://login.orionadvisor.com/](https://login.orionadvisor.com/)">Orion</a></li> </ul> </li> <li> <a href="[https://theretirementinstructor.com/blog/](https://theretirementinstructor.com/blog/)" class="nav-links">Blog</a> </li> <a href="[https://theretirementinstructor.com/schedule-a-meeting/](https://theretirementinstructor.com/schedule-a-meeting/)" class="nav-links">Contact</a> </li> </ul> </nav> </body> </html> CSS: @charset "UTF-8"; /* CSS Document */ /* Reset CSS */ /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { } body { } ol, ul { } blockquote, q { } blockquote:before, blockquote:after, q:before, q:after { } table { } * { box-sizing: border-box; padding: 0; margin: 0; } .navbar { font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; font-size: 16px; background-color:#FFFFFF; } .main-nav { list-style-type: none; display: none; } .nav-links,.nav-link-main { text-decoration: none; color: #000000; position: relative; } .main-nav li { text-align: center; margin: 20px auto; padding-left: 10px; } nav ul li ul { display: none; position: absolute; background-color: #e8e8e8; border-radius: 0px 0px 4px 4px; } nav ul li:hover ul { display:block; } nav ul li ul li{ width: 180px; padding: 4px; border-radius: 4px; } nav ul li ul li a { padding: 2px; } nav ul li ul li a:hover { background-color: #f3f3f3; } .logo { display: inline-block; margin-top: 10px; width: 210px; } .navbar-toggle { position: absolute; top: 10px; right: 20px; cursor: pointer; color: #b44438; font-size: 24px; } .active { display: block; background-color: #F2F2F2; } @media screen and (min-width: 768px) { .navbar { display: flex; justify-content: space-between; padding-bottom: 0; height: 70px; align-items: center; } .main-nav { display: flex; margin-right: 30px; flex-direction: row; justify-content: flex-end; } .main-nav li { margin: 0; } .nav-links { margin-left: 20px; } .logo { margin-top: 0; } .navbar-toggle { display: none; } .logo:hover, .nav-links:hover { color: #b44438; } } JS: // JavaScript Document let mainNav = document.getElementById("js-menu"); let navBarToggle = document.getElementById("js-navbar-toggle"); navBarToggle.addEventListener("click", function() { mainNav.classList.toggle("active"); });
  6. Hello everyone, I want to print a web page with all things inside but I have a big issue. I loaded the web page converted in pdf and when I print the tables or pictures are split int half and on two pages. I Want to define in my code some sections to keep the tables or pictures on the same pages when I print. How can I do that ?
  7. $(function() { $("#demo").keyup(function(){ var len = $("#demo").val(); if(len.length>8){ var el = $("<p></p>").html(""); $("#holder").append(el); //$("p").addClass("alert alert-warning"); var x = $("<span></span>").html(" Too long"); $("p").append(x); $("span").addClass("glyphicon glyphicon-alert"); stop(); } else if(len.length<=8){ $("#holder p").children().remove(); } }); });
  8. Browser: Chrome (displaying at 100%) Desktop Monitor: 4K When displaying a simple table of one cell, the table displays roughly twice the size it should. Just as though you zoomed in 200%. I have a 4K desktop monitor and the table should display the full width 3840px and a height of 2560px. But the table is displaying twice that size. How do I display this table so it fits correctly on my screen (3840 x 2560)? How can something so simple be this difficult to accomplish? HTML Code: <!DOCTYPE html> <html> <head> <title> Test </title> <link rel="stylesheet" type="text/css" href="css/styles.css"> </head> <body> <table> <tr> <td> </td> </tr> </table> </body> </html> Style Sheet Code: body{ margin: 0; }
  9. Dear all, Using a small webpage for my app, I am confused because I don't how to stop the function I did. I am using a C++ program which grab pictures in a file. I read the file and update it each 2 seconds. The functions I used are: <script language="javascript"> function updateImage() { obj = document.imagename; obj.src = obj.src + "?" + Math.random(); setTimeout("updateImage()",2000); } </script> <script language="javascript"> function showPicture() { var sourceOfPicture = "/home/tux/Prog/Medias/Images/calib1.png"; var img = document.getElementById('bigpic') img.src = sourceOfPicture.replace('90x90', '225x225'); img.style.display = "block"; } </script> And I call them like this: <h1>Camera Preview</h1> <button onclick="showPicture()">Start Preview</button><br><br> <body onload="updateImage()"> <img style="display:block;" id="bigpic" src="bigpic" name="imagename" width="340" height="240"> Can you tell me how can I do to add a "stop" button to stop the update, and conserving the last image on screen ? Thank you for your help and support. Best regards,
  10. Hello everyone. (Sorry for my bad english, I'm french)So I have an HTML page with a header, a footer, a lateral menu and of course, content.It is perfectly sized for desktops and mobiles (thanks to a media query I invented, which is : @media screen and (max-aspect-ratio: 7/8) and (min-height: 1100px){ /* MY CODE HERE */ } The content is perfectly adjusted like this : , thanks to: html{font-size: 200%} in this media query. I precise that ALL my font-sizes and padding between divs / paragraphs are in "rem" unit. But the problem is, that when I exceeds the precise nuber of 89 characters, the texte suddenly look like this : But only on mobile devices (with the media query I said previously)... I visualized this with the Chrome developer tool -> Device toolbar (Ctrl + Shift + I then Ctrl + Shift + M) There I do a little as if it was not serious but it's days that I drudge everywhere and nobody was able to give me an answer ... I put the page online so you can watch it more precisely...http://vincentvincent.rf.gd/l-histoire.html Thanks for your help.
  11. QUESTION: Is the following an accurate statement? If not, please clarify how a unicode string literal differs from say, an ASCII string literal. Roddy Untitled-1.html
  12. carrinho.php I dont have a scroll bar on my shopping cart, and i can't implement one
  13. I like the automatic slideshow in the example here: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_slideshow_auto, but would like 2 slideshows on one page. When I try to do this myself, one slideshow plays and finishes, then the other one starts and finishes. I would like them to start at the same time and loop and like the caption option but don't necessarily need the "dots".
  14. hello! I cant find any code for tilled background for html any one help?😐 plz reply fast
  15. i need to change the background color and other stuff of some <a> elements but not every single <a>, so i defined a class for the elements that i need to change but I don't know how to use the class name to define a:active or a:hover if i use #classname:hover it doesn't work. Can you tell me how to do it?
  16. Hi, I recently started using html on a Mac. I noticed that using the double quotes for an attribute gives an error, as seen in the images attached. I faced the same problem while using the title attribute for the paragraph tag. The first double quote and the first world only were displayed as a tooltip. Thank you.
  17. Attention: W3Schools Forums members: Does anyone know how to format a paragraph in hypertext markup language version 5 ( HTML 5 ), so that there is no indentation of the first line of text, and with a margin around the text? Thank you ( see Colossians 3:15, for example ) for your help and your patience. Keep in touch. 😊 Sincerely in Christ, Russell E. Willis P.S. - Please read Proverbs 23:23.
  18. Hello All, I'm trying to create a table of images in which each image would be a different link to a product on our website. I'm just learning how to code so I appreciate any help you can give! Attached is pdf showing the general layout of what I'm trying to do. Thanks! Line Card 10-16-18.pdf
  19. Hi! Im trying to add a function that gives the text in my code a random background color (either yellow, red or green). I want this random color change to happen when I press the button. Can anyone help me with this? my code sofar is: <!DOCTYPE html> <html> <body> <p id="output_paragraph">Click the button to change the text in this paragraph.</p> <button onclick="myFunction()">Try it</button> <script> function myFunction() { document.getElementById("output_paragraph").innerHTML = "Hello World"; } </script> </body> </html>
  20. I am building my first web site using HTML, CSS, and Bootstrap. After extensive searching, I can’t get my HTML file to link with my CSS file. The HTML document and CSS document are in the same domain so there shouldn’t be any reason to mention a file in the code, but my CSS isn’t affecting the HTML when I load it in Chrome. Any help would be greatly appreciated. I have enjoyed learning how to make a website, but this is hampering my progress/enjoyment. Below is some of the code (most comes from the Bootstrap site with minor customization). <head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--> <title>TruNord</title><link href=“GOOGLE FONT PAGE” rel=“stylesheet” /><link href=“css/bootstrap.min.css” rel=“stylesheet” /><link href=“main.css” type=“text/css” rel=“stylesheet” /></head>
  21. I am designing a Sharepoint page with script editor. I have an image which I have used area tag on. So with onmouseover another image pops up and it reverts back onmouseout. I further want to use another area tag on this new image onmouseover where I can add area tags on this new image. Something like a nested image map. For description sake. I will use script from w3schools. <img src="planets.gif" width="145" height="126" alt="Planets" name="myname" usemap="#planetmap"> <map name="planetmap"> <area shape="rect" coords="0,0,82,126" onmouseover=myname.src="C:\Users\Quabynar\Pictures\sun.gif" ; onmouseout=myname.src="C:\Users\Quabynar\Pictures\planets.gif"> <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury"> <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus"> </map> I expect to put another map with area tags on the sun.gif when onmouseover where I can use href to say a link about description the Sun. I don't seem to get around it.
  22. I'm basically a coding amateur and need help! I used this page to find an accordion that works well for what I need (I'm looking for an accordion that can have all open at once) and am basically using this permutation, edited only for content & style. Is there a way to start with them all open instead of all closed? The simpler the better for this frustrated amateur! Thanks!
  23. Hi there, I went into a problem, might be simple for you but I am sitting here and try it out for many many many hours... Here is the thing, at the top is my header, the header is seperated with php in another file/folder and with a php code it is displaying in the index home file. I would like to have the background video fully covered under my content body and under my header. But whenever I put it, then it is under my content only and the header is disappearing for some reason. Also, when I put it for header only, then I will get it at the top only and the body will be empty with my normal content but without the background video. Here is the code I am using: #CSS * { box-sizing: border-box; } body { margin: 0; font-family: Arial; font-size: 17px; } #myVideo { position: fixed; right: 0; bottom: 0; min-width: 100%; min-height: 100%; } HTML <video autoplay muted loop id="myVideo"> <source src="https://www.belloo.date/upgrade/themes/landing2/images/bg.mp4" type="video/mp4"> Your browser does not support HTML5 video. </video> I put the CSS at the top in the header section and the other stuff in front of my body content. Any suggestions? :(
  24. Hello Friends, I have observed that some of the current tools like JIRA are in high demand for technology organizations. Thus, I am trying to use this forum to explore the possible wonders that can be done via HTML coding for JIRA's TEXT Gadget. 1) I have worked on creating tables & connecting multiple dashboards using HTML for JIRA and it has saved a lot of time and effort for our teams. 2) Now; i was trying to understand the other possible ways; we can code in HTML to make the tool more interactive. For instance - I am looking for your guidance on different aspects on how we can make the JIRA Text Gadget Dashboards more interactive. Like - a) We have queries in JIRA and can we not link the HTML to pull data from within another Gadget in JIRA? b) Need help in the below on priority - i) Assume I have 5 images (say - A / B / C / D / E )and I am working on a single Text Gadget say "MY IMAGES" - Now; if I click on image A which is currently visible in the "MY IMAGES" text gadget; I want the click to take me to next image - Image B (but in the same "MY IMAGES" gadget) and then If I click on Image B it should take me to the next image C (but within the same text Gadget - MY IMAGES) and so on. ii) Further, assuming I have a portion of my image saying Back - and if i am on Image E and If I click on Back; it should take me to Image D (as that was the previous image). I tried using the W3School for <a href: </a>. But for some reason when i paste the link of next image there; if doesn't take it. Where as the example in W3school has .htm values only. Also, how can i restrict the view to the active image and not show the next image unless we click on the first one (but all within the same GADGET - "MY IMAGES" Thus, can we please work together on this requirement? The tool W3School can use all these codes we use; as examples linked to each / complex code and can be of great help to the browsers in future. Please advise. Thanks, Manish
  25. KaiAdrian

    css inheritance

    HI! I d like to make Meni2_vsebina to be child of Meni2 (but both independent from Meni and Meni_vsebina) as far as I change position of Meni everything change it. Here is the code: <style> .Meni > Meni_vsebina{ display: inline-block; position:fixed; top:-2px; left:100px; } .Meni_vsebina{ display:block; position:relative; } .Meni2 > Meni2_vsebina{ display:block; position: relative; top:-100px; left:100px; } .Meni2_vsebina{ position:absolute; left: 100px; display:inline-flex; } </style> <body> <div class="Meni"> <span><i>Meni</i> </span> <div class="Meni_vsebina"> <a href="test1.html">Test1</a><br> <a href="test2.html">Test2</a><br> <a href="test3.html">Test3</a><br> <a href="test4.html">Test4</a><br> </div>
  • Create New...