Jump to content

Search the Community

Showing results for tags 'Html'.

  • 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. I apologize for posting in VBS, I was in a hurry. I searched for hours for a simple code to count "1, 2, 3, 4, 5, 6, 7, 8" as "1, 2, 4, 8, 16, 32, 64, 128" in JS or HTML or CSS; Multiplying the same number with itself didn't work. I want simple code and Google would not show anything. I found "Math.pow()" and "Math.LOG()", but can't find a simple code with an example of "Math.GMS" if Geometric Sequence, or "Math.GMP" if Geometric Progression. What is the simplest I can write? Do I have to combine two or more versions of "Math.xxx()" with my number? The formula is confusing, so I could not write it using that code. Not to be rude, but PLEASE ANSWER, my last question never got an answer. If you don't even answer this one as well, what's the point of this site? If I can't ask something without getting an answer, I will have to ask elsewhere. I SIGN UP TO GET AN ANSWER, not to just quit and go elsewhere. So if you have any help, PLEASE HELP! I would like to have it count "1, 2, 4, 8, 16, 32, 64, 128, 256, 512, 1024, 2048, 4096..." when entering "1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13...". This is the closest I got; <input type="number" id="exmp" value="1"> <button onclick="myExample()">Convert</button> <p id="exmpone1"></p> <script> function myExample() { var no = document.getElementById("exmp").value; document.getElementById("exmpone1").innerHTML = Math.pow(no, no); } </script>
  2. Hello, can anyone please suggest what change should I make in order to make login using email/username either in same field or 2 different fields. <?php // Initialize the session session_start(); // Check if the user is already logged in, if yes then redirect him to welcome page if(isset($_SESSION["loggedin"]) && $_SESSION["loggedin"] === true){ header("location: welcome.php"); exit; } // Include config file require_once "c.php"; // Define variables and initialize with empty values $username = $password = ""; $username_err = $password_err = $login_err = ""; // Processing form data when form is submitted if($_SERVER["REQUEST_METHOD"] == "POST"){ // Check if username is empty if(empty(trim($_POST["username"]))){ $username_err = "Please enter username."; } else{ $username = trim($_POST["username"]); } // Check if password is empty if(empty(trim($_POST["password"]))){ $password_err = "Please enter your password."; } else{ $password = trim($_POST["password"]); } // Validate credentials if(empty($username_err) && empty($password_err)){ // Prepare a select statement $sql = "SELECT id, username, password FROM users WHERE (username = ? OR email= ?)"; if($stmt = mysqli_prepare($link, $sql)){ // Bind variables to the prepared statement as parameters mysqli_stmt_bind_param($stmt, "s", $param_username); // Set parameters $param_username = $username; // Attempt to execute the prepared statement if(mysqli_stmt_execute($stmt)){ // Store result mysqli_stmt_store_result($stmt); // Check if username exists, if yes then verify password if(mysqli_stmt_num_rows($stmt) == 1){ // Bind result variables mysqli_stmt_bind_result($stmt, $id, $username, $hashed_password); if(mysqli_stmt_fetch($stmt)){ if(password_verify($password, $hashed_password)){ // Password is correct, so start a new session session_start(); // Store data in session variables $_SESSION["loggedin"] = true; $_SESSION["id"] = $id; $_SESSION["username"] = $username; // Redirect user to welcome page header("location: welcome.php"); } else{ // Password is not valid, display a generic error message $login_err = "Invalid username or password."; } } } else{ // Username doesn't exist, display a generic error message $login_err = "Invalid username or password."; } } else{ echo "Oops! Something went wrong. Please try again later."; } // Close statement mysqli_stmt_close($stmt); } } // Close connection mysqli_close($link); } ?> also, here is my error code- <?php // Initialize the session session_start(); // Check if the user is already logged in, if yes then redirect him to welcome page if(isset($_SESSION["loggedin"]) && $_SESSION["loggedin"] === true){ header("location: welcome.php"); exit; } // Include config file require_once "c.php"; // Define variables and initialize with empty values $username = $password = ""; $username_err = $password_err = $login_err = ""; $email = $password = ""; $email_err = $password_err = $login_err = ""; // Processing form data when form is submitted if($_SERVER["REQUEST_METHOD"] == "POST"){ // Check if username is empty if(empty(trim($_POST["username"]))){ $username_err = "Please enter username."; } else{ $username = trim($_POST["username"]); } // Check if mail is empty if(empty(trim($_POST["email"]))){ $email_err = "Please enter mail"; } else{ $email = trim($_POST["email"]); } // Check if password is empty if(empty(trim($_POST["password"]))){ $password_err = "Please enter your password."; } else{ $password = trim($_POST["password"]); } // Validate credentials if(empty($username_err) && empty($email_err) && empty($password_err)){ // Prepare a select statement $sql = "SELECT id, username, email, password FROM users WHERE (username = ? OR email= ?)"; if($stmt = mysqli_prepare($link, $sql)){ // Bind variables to the prepared statement as parameters mysqli_stmt_bind_param($stmt, "s", $param_username); // Set parameters $param_username = $username; // Attempt to execute the prepared statement if(mysqli_stmt_execute($stmt)){ // Store result mysqli_stmt_store_result($stmt); // Check if username exists, if yes then verify password if(mysqli_stmt_num_rows($stmt) == 1){ // Bind result variables mysqli_stmt_bind_result($stmt, $id, $username, $hashed_password); if(mysqli_stmt_fetch($stmt)){ if(password_verify($password, $hashed_password)){ // Password is correct, so start a new session session_start(); // Store data in session variables $_SESSION["loggedin"] = true; $_SESSION["id"] = $id; $_SESSION["username"] = $username; // Redirect user to welcome page header("location: welcome.php"); } else{ // Password is not valid, display a generic error message $login_err = "Invalid username or password."; } } } else{ // Username doesn't exist, display a generic error message $login_err = "Invalid username or password."; } } else{ echo "Oops! Something went wrong. Please try again later."; } // Close statement mysqli_stmt_close($stmt); } } // Close connection mysqli_close($link); } ?> Please check it!
  3. Hi, I am trying to learn HTML, CSS, JavaScript and PHP and I already tried many free and paid apps and websites but most of them not covering the full language and just learn part of it so I would like to know please are the free or the paid courses here covering everything? Every tag attributes properties…etc? thanks.
  4. Hi I would like to have a kind of template file that every html file on my webserver pulls some code from. Like for example the header should be always the same. So if I change it in the template, every site will show the updated code + its own code of course. An iframe would not be the right thing (since I don’t want to pull a whole html file, only like two or three lines of code). Thanks
  5. What happens if I use style.display=""; let's say on some rows <tr> of a table. What is the output if I'm not using defined Property values but instead leaving the space empty?
  6. Here's my code: <nav class="navbar navbar-inverse"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div class="navbar" id="myNavbar"> <a href="file:///home/chronos/u-1a42361665a19f7075d43134a693f5846d3835e8/MyFiles/home.htm">Home</a> <a href="https://www...">Store</a> <a href="https://www.ups.com/track?loc=en_US&requester=ST/">Track Your Package</a> <a href="file:///home/chronos/u-1a42361665a19f7075d43134a693f5846d3835e8/MyFiles/aboutme.htm">About Me</a> <a href="file:///home/chronos/u-1a42361665a19f7075d43134a693f5846d3835e8/MyFiles/artclub.htm">Andrew's Art Club</a> <div class="dropdown"> <button class="dropbtn">Need to Know <i class="fa fa-caret-down"></i> </button> <div class="dropdown-content"> <a href="file:///home/chronos/u-1a42361665a19f7075d43134a693f5846d3835e8/MyFiles/returns.htm">Returns</a> <a href="#">Shipping Claims</a> <a href="#">Terms of Service</a> <a href="#">Privacy Policy</a> <a href="https://www...">Help Center</a> </div> </div> <a href="#">Deals</a> <a href="https://www...">Sign-in</a> <div class="dropdown"> <button class="dropbtn">Languages <i class="fa fa-caret-down"></i> </button> <div class="dropdown-content"> <a href="#">English 🇺🇸/🇬🇧</a> <a href="https://www...">Español 🇪🇸/🇲🇽</a> <a href="https://www...">Français 🇫🇷/🇨🇦</a> <a href="https://www...">Русский 🇷🇺 </a> <a href="https://www...">Italiano 🇮🇹</a> <a href="https://www...">Deutsche 🇩🇪</a> <a href="https://www...">中国人 🇨🇳/🇹🇼/🇭🇰</a> <a href="https://www...">Português 🇵🇹/🇧🇷</a> </div> </div> </div> </div> </nav> I was super excited that the navbar works now, only to be crushed when the dropdowns stopped working. Any suggestions?
  7. Can you please Help Me to Fix this Issue? Please Help. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML HTML 5 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" /> <META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW" /> <title>Testing</title> <style type="text/css"> body { margin-top: 0px; margin-bottom: 0px; background-color: #CCFFCC; } #MainContainer01 { width: 620px; margin: 0 auto; } .Header { font-family: Arial, Helvetica, sans-serif; color: #FFFFFF; text-align: center; font-size: 25pt; background-color: #000080; line-height: 75px; height: 75px; } .HREFNoBorder { border-width: 0px; } .FL { width: 310px; height:381px; text-align: center; padding-bottom: 30px; background-color:fuchsia; float: right; } .gap { line-height: 35px; height:35px; /*clear: both;*/ } .TitleSegment { line-height: 30px; font-family: Arial; font-size: 12pt; background-color: #CCFFFF; text-align: right; width: 301px; } </style> </head> <body> <div id="MainContainer01"> <div class="Header"></div> <div class="gap"></div> <div class="FL"> <div class="TitleSegment">Title Segment</div><a target="_blank" href="#"> <img alt="#" longdesc="#" src="https://post.healthline.com/wp-content/uploads/2020/09/blue-lotus-flower-732x549-thumbnail.jpg" width="301" height="381" class="HREFNoBorder" /></a></div> <div class="FL"> <div class="TitleSegment">Title Segment</div><a target="_blank" href="#"> <img alt="#" longdesc="#" src="https://th.bing.com/th/id/OIP.caLpUQWyd1PZV5SRvDOZFQHaE8?w=270&h=180&c=7&o=5&pid=1.7" width="301" height="381" class="HREFNoBorder" /></a></div> </div> </body> </html>
  8. Hello everyone, I'm trying to get abbreviate states from plain text into HTML select and option, seem it's not working. Can you help me? here my PHP code: /* Read file to insert as option in HTML */ $file = fopen("States.txt","r") or exit("Unable to read"); while(!feof($file)) { $states = fgets($file); $statelist = "<option value='".$states."'>".$states."</option>"; } fclose($file); Then <tr><td>State:</td><td><select id="abb" name="abb"><?php echo $statelist ?></select></td></tr> Thank you for help
  9. If you wanna learn HTML and CSS fast and free you can use the tutorials what I am making! Here is the link of the channel! [Link removed]
  10. Hi guys, I am having problems using dynamic data list, It doesn't work when I insert a form into Blogspot, how should I fix it? <html> <head> </head> <body contenteditable="false"> <script> function populate(Ts7, Ts8){ var Ts7 = document.getElementById(Ts7); var Ts8 = document.getElementById(Ts8); Ts8.innerHTML = ""; if(Ts7.value == "Phòng kế hoạch"){ var optionArray = ["|","|Phòng kế hoạch"]; } else if(Ts7.value == "Bản"){ var optionArray = ["|","|Bản1","|Bản2","|Bản3"]; } else if(Ts7.value == "Huyện"){ var optionArray = ["|","|Huyện1","|Huyện2"]; } else if(Ts7.value == "Tỉnh"){ var optionArray = ["|","|Tỉnh1","|Tỉnh2"]; } else if(Ts7.value == "Trung ương"){ var optionArray = ["|","|Trung ương1","|Trung ương2"]; } for(var option in optionArray){ var pair = optionArray[option].split("|"); var newOption = document.createElement("option"); newOption.value = pair[0]; newOption.innerHTML = pair[1]; Ts8.options.add(newOption); } } </script> <p>1. Cấp</p> <select name="entry.694698089" id="Ts7" required="" onchange="populate(this.id,'Ts8')"> <option value="">Chọn</option> <option value="Phòng kế hoạch">Phòng kế hoạch</option> <option value="Bản">Bản</option> <option value="Huyện">Huyện</option> <option value="Tỉnh">Tỉnh</option> <option value="Trung ương">Trung ương</option> </select> <p>2. Nội dung</p> <select id="Ts8" name="entry.1049020395" required=""></select> </body> </html> bandicam 2021-03-03 16-25-54-648.mp4
  11. I found the HTML encoding code, It works the way is encoding plus set password, It works very well ... But what I need is only HTML encoding, not password setting. I edited the above code myself but it doesn't work and need your help? And here is the code: https://www.w3schools.com/code/tryit.asp?filename=GO520MFBKDUJ
  12. I found a snippet of code to get data from a cell in a Google sheet into an HTML input ... It works fine, but not met ... My requirement is that it should work. after I press the button, do not automatically run when opening or loading the Web page as it is now ... Can you please fix it according to my mind, Thank you very much in advance. <html> <body> <input name="form1_1" id="f1_1" type="text" /> <button name="submit_form1" id="submit_form1" type="button" onclick="">Click here to get data</button> </body> <script> const onDataLoaded = (data) => { const e20Content = data.feed.entry.find((entry) => entry.title.$t == 'E20').content.$t document.getElementById('f1_1').value = e20Content } </script> <script src="https://spreadsheets.google.com/feeds/cells/1TbMrtJl01i-Q5YudlhdAB_E1LTYkkLswnql5LHyiIuk/1/public/basic?alt=json-in-script&callback=onDataLoaded"></script> </html>
  13. Hi All, I've seen that in PHP you can include a require or include function which saves you from having to add the entire code for headers and footers for each page. Does a similar things exist in HTML? If so, please direct me. Thanks in advance Russell
  14. Hi! I'm new on all this javascript coding world, and currently I am working on a gaming review website. The question I have, is that i've implemented autocomplete on my search field (works great: How To Create Autocomplete on an Input Field (w3schools.com)) and I would like to add that when the user clicks an option the "enter key" is triggered. This is beacause I made my web in a way that you have to write things down, and if you click one of the elements and it writes itself does nothing for me, instead if you press enter when hovering above the item you can select it as if it was a "click" but actually detects also the enter effect as a key so it works fine! So to express myself a bit better: My goal is to click an item of the autocomplete list, and when I do it, the enter key will trigger and my search field will detect the keyboard input. Thanks in advanced!
  15. maddymath

    Maddy

    Hi all, I am looking to create automated emails for my work. I'm quite a novice coder and the only code format Mailchimp allows in email campaigns is HTML. I want to create an automated email that goes out every week that asks our contributors to submit an artwork for the following week. I am wondering if there is a piece of date / time HTML that would allow me to say: "current date + 7 days" so I don't have to manually add the dates in for every email. Hopefully that makes sense! Thanks in advance for your help, Maddy
  16. 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🤠
  17. <div class="topnav" id="myTopnav"> <div class="topnav-centered"> <a href="index.html">JACQUELYN MCGARRY</a> </div> <div class="topnav-right"> <a href="shop.html">SHOP</a> <a href="work.html">WORK</a> </div> <a href="about.html">ABOUT</a> <a href="contact.html">CONTACT</a> <a href="javascript:void(0);" class="icon" onclick="myFunction()"><i class="fa fa-bars"></i> </a> </div> <script> function myFunction() { var x = document.getElementById("myTopnav"); if (x.className === "topnav") { x.className += " responsive"; } else { x.className = "topnav"; } } </script> .topnav { position: fixed; top: 0; width: 100%; padding: 0px; } .topnav a { float: left; display: block; text-align: center; padding: 14px 24px 12px 24px; } .topnav a:hover { padding: 12px 22px 10px 22px; } @media screen and (max-width: 600px) { .topnav a{ float: none; display: block; } .topnav-centered a { position: relative; top: 0; left: 0; transform: none; } .topnav-right a{ float: none; position: relative; } } .topnav .icon { display: none; } @media screen and (max-width: 500px) { .topnav a:not(:first-child) {display: none;} .topnav a.icon { float: left; display: block; } } .topnav-centered a { float: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .topnav-right { float: right; } @media screen and (max-width: 500px) { .topnav.responsive {position: fixed;} .topnav.responsive .icon { position: absolute; right: 0; top: 0; } .topnav.responsive a { float: none; display: block; /* text-align: left;*/ } } My float right menu items don't nest in the hamburger menu. I tried float:left on mobile for topnav-right with no luck. I have no idea how to fix it. Code has been personalized from w3schools tutorials
  18. I have a fixed menu with a centered logo, left and right menu items. My float right menu items are showing beside the hamburger menu on responsive/mobile settings. The menu uses float: right for positioning the hamburger menu and the menu items. <div class="topnav" id="myTopnav"> <div class="topnav-centered"> <a href="index.html">JACQUELYN MCGARRY</a> </div> <div class="topnav-right"> <a href="shop.html">SHOP</a> <a href="work.html">WORK</a> </div> <a href="about.html">ABOUT</a> <a href="contact.html">CONTACT</a> <a href="javascript:void(0);" class="icon" onclick="myFunction()"><i class="fa fa-bars"></i> </a> </div> <script> function myFunction() { var x = document.getElementById("myTopnav"); if (x.className === "topnav") { x.className += " responsive"; } else { x.className = "topnav"; } } </script> .topnav { position: fixed; top: 0; width: 100%; padding: 0px; background-color: #f9f7f7; overflow: hidden; text-transform: uppercase; letter-spacing: 2px; border-bottom-style: solid; border-width: 2px; } .topnav a { float: left; display: block; color: #000000; text-align: center; padding: 14px 24px 12px 24px; text-decoration: none; font-size: 13px; font-weight: 900; font-style: normal; } .topnav a:hover { padding: 12px 22px 10px 22px; border-style: solid; border-width: 2px; border-radius: 50%; color: #101010; } .topnav .icon {display: none;} @media screen and (max-width: 600px) { .topnav a{ float: none; display: block; } .topnav-centered a { position: relative; top: 0; left: 0; transform: none; } } @media screen and (max-width: 600px) { .topnav-right { background-color: red; float: none; } } .topnav-centered a { float: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .topnav-right { float: right; } @media screen and (max-width: 500px) { .topnav a:not(:first-child) {display: none;} .topnav a.icon { float: left; display: block; } } @media screen and (max-width: 500px) { .topnav.responsive {position: fixed;} .topnav.responsive .icon { position: absolute; right: 0; top: 0; } .topnav.responsive a { float: none; display: block; /* text-align: left;*/ } }
  19. I have used this gallery from W3Schools https://www.w3schools.com/howto/howto_js_slideshow_gallery.asp and i want to add function arrow keyboard keys to change pictures in the gallery. Can someone here help me out?
  20. Hello, everyone. I'm trying to make web page by using HTMl file, but it seems i have some problems. A person allowed me to download, edit, and use his own HTML file, so i can create my own web page. I dont have programming abilities, but i still can understand some parts of the code. I started adding more pictures to the web page, by increasing the HTML code, but i got problems. To add a new photo, i used copy-paste of the previous code that contains another photo, so i when i used the code to add one more photo, i only changed the name of the photo that have to be shown. But now, when i add one more photo, the page receives one more container container. For example, see the following code: </div> <div class="BlackBox"> <div class="TLDR">HERE I ADD THE TEXT I WANT TO BE SHOWN. </div> <div class="Gallery-Content--mediaContainer"><a name="NAME_OF_THE_PHOTO.JPG"></a> <div class="Gallery-Content--media"> <div class="imageContainer"> <img class="image-thumb" src="./NAME_OF_THE_FOLDER_THAT_CONTAINS_IMAGES/NAME_OF_PHOTO.JPG"/>Full-size image is <a href="./NAME_OF_THE_FOLDER_THAT_CONTAING_IMAGES/NAME_OF_THE_PHOTO.JPG">here.</a> </div> When i want to add one more photo, i will not write new code/newkind of code, i will simply copy and paste the already existing code, and then i will simply change the name of the photo, and will replace the old name with new name, so new photo can be show on the web page. Here is how the original page look like: https://i.imgur.com/Ad3qiAS.png Here is how my page look like: https://i.imgur.com/RkguhC6.png As you can see, in the first photo, all pictures are separated. In the second photo, there are containers. Everytime when i copy and paste the code, new container is added. How to remove these containers?
  21. I found this JS snippet here on W3S when I was looking for a method to change prices (printed in HTML not as product attribute) in a WooCommerce store. document.getElementById("id01"); element.innerHTML = "New Heading"; I changed it to: document.getElementById("440050").innerHTML = "€61,00"; The way I assign the id to the HTML is: <strong id="440050">PRICE</strong> This worked - of course but every next script with another id I add doesn't work: === document.getElementById("440050").innerHTML = "€61,00"; document.getElementById("440039").innerHTML = "€42,00"; ==== The second script (with id 440039) doesn't change anything, so what you see on the frontend is PRICE So it seems to work only for one instance? What is the best way to do this?
  22. As the title suggests, the site that I have just finished and delivered, therefore also online, works perfectly on all browsers except safari. I can't understand what the problem is. Do you have any ideas ?? On the home page, the parallax effect "vibrates" tremendously, almost causing nausea. here the link of the page, to understand what I mean, open them with google chrome (fluid and perfect site) and then check with safari. Homepage www.teamcobram.com if it were useful I could also post the code, but you can find it on the site without problems. many thanks in advance
  23. https://www.w3schools.com/howto/howto_js_collapsible.asp Total noob, have some ideas, but still a bit unsure on the best approach. Was going to implement something similar to what's here (also see supplementary page) http://www.dynamicdrive.com/dynamicindex17/ddaccordion.htm thank-you!
  24. Hello.I started learning javascript and my professor give me this to solve. Its program that turn on and turn off bulbs on different ways. It have number of bulbs and number of variations . The problem is that i don't know how to use function deleteBulbs because when i type smaller number , those who left must get changed with blank.jpg but they won't. Please help me and sorry for my bad english. I uploaded images with problem. In first example, 3 are turned on . So in example 2,when i type 1 and 0, last bulb is turned off and other 2 must be blank but they are not in my case. <!DOCTYPE html> <html> <head> <title> </title> </head> <body> <p> <b> Task: </b> There are <i> n </i> bulbs in the room, each of which is turned on by a separate switch. How many ways can a room be lit? </p> Number of bulbs: <input id = "numOfBulbs" type = "number"> </p> Number of variations<input id="numOfVariations" type="number"></p> <p> <button type="button" onclick="numOfVariations();">Light up </button> </p> <img id="image7" src="blank.jpg"> <img id="image6" src="blank.jpg"> <img id="image5" src="blank.jpg"> <img id="image4" src="blank.jpg"> <img id="image3" src="blank.jpg"> <img id="image2" src="blank.jpg"> <img id="image1" src="blank.jpg"> <img id="image0" src="blank.jpg"> <p id="solution"></p> <script> function numOfVariations() { var n, i, p=1,v,s; n=document.getElementById("numOfBulbs").value; if(n>8 || n<=0) { window.alert("Incorrect number of bulbs!"); var s=document.getElementById("image0").value; s.src="blank.jpg" ; s=document.getElementById("image2").value; s.src="blank.jpg"; s=document.getElementById("image3").value; s.src="blank.jpg"; s=document.getElementById("image4").value; s.src="blank.jpg"; s=document.getElementById("image5").value; s.src="blank.jpg"; s=document.getElementById("image6").value; s.src="blank.jpg"; s=document.getElementById("image7").value; s.src="blank.jpg"; document.getElementById("solution").innerHTML="Total variations: 0"; return; } v=document.getElementById("numOfVariations").value; for (i=1;i<=n;i++) p*=2; if((v<0) || (v>=p)){ window.alert("Incorrect number of variations!"); var s=document.getElementById("image0").value; s.src="blank.jpg" ; s=document.getElementById("image1").value; s.src="blank.jpg"; s=document.getElementById("image2").value; s.src="blank.jpg"; s=document.getElementById("image3").value; s.src="blank.jpg"; s=document.getElementById("image4").value; s.src="blank.jpg"; s=document.getElementById("image5").value; s.src="blank.jpg"; s=document.getElementById("image6").value; s.src="blank.jpg"; s=document.getElementById("image7").value; s.src="blank.jpg"; document.getElementById("solution").innerHTML="Total variations:"+ p; return; } document.getElementById("solution").innerHTML="Total variations:"+ p; p=1; for(i=0;i<n;i++){ if(v&p) turnOn(i); else turnOff(i); p*=2; } } function turnOff(i) { var s; if(i==0){ s=document.getElementById("image0"); s.src="off.jpg"; } if(i==1){ s=document.getElementById("image1"); s.src="off.jpg"; } if(i==2){ s=document.getElementById("image2"); s.src="off.jpg"; } if(i==3){ s=document.getElementById("image3"); s.src="off.jpg"; } if(i==4){ s=document.getElementById("image4"); s.src="off.jpg"; } if(i==5){ s=document.getElementById("image5"); s.src="off.jpg"; } if(i==6){ s=document.getElementById("image6"); s.src="off.jpg"; } if(i==7){ s=document.getElementById("image7"); s.src="off.jpg"; } } function turnOn(i) { var s; if(i==0){ s=document.getElementById("image0"); s.src="on.jpg"; } if(i==1){ s=document.getElementById("image1"); s.src="on.jpg"; } if(i==2){ s=document.getElementById("image2"); s.src="on.jpg"; } if(i==3){ s=document.getElementById("image3"); s.src="on.jpg"; } if(i==4){ s=document.getElementById("image4"); s.src="on.jpg"; } if(i==5){ s=document.getElementById("image5"); s.src="on.jpg"; } if(i==6){ s=document.getElementById("image6"); s.src="on.jpg"; } if(i==7){ s=document.getElementById("image7"); s.src="on.jpg"; } } function deleteBulbs(i) { var s; if(i==0){ s=document.getElementById("image0"); s.src="blank.jpg"; } if(i==1){ s=document.getElementById("image1"); s.src="blank.jpg"; } if(i==2){ s=document.getElementById("image2"); s.src="blank.jpg"; } if(i==3){ s=document.getElementById("image3"); s.src="blank.jpg"; } if(i==4){ s=document.getElementById("image4"); s.src="blank.jpg"; } if(i==5){ s=document.getElementById("image5"); s.src="blank.jpg"; } if(i==6){ s=document.getElementById("image6"); s.src="blank.jpg"; } if(i==7){ s=document.getElementById("image7"); s.src="blank.jpg"; } } </script> </body> </html> y are not. bulbs translated.rar
  25. Hello everyone, I would be very appreciative to understand how to use the W3C Schools Template so that I can have multiple stored images served depending on the device width. In other words rather than uploading just one image and letting the template resize it going from a widescreen to mobile size, I'd like some control with regards to the centering of each image. Also, I can then optimise the image sizes too to be radically smaller for mobile (do the W3C Schools Templates automatically optimise image size for me, for example a wide screen image may be hard to reduce to under 200 KB to retain quality versus some images on mobile coudl easily be fine at 30 KB). Thanks so much for your help! Kind regards, Mike
×
×
  • Create New...