Search between a Gas Station

Posts

Showing posts with the label html

select picture by choosing date in datepicker

select picture by choosing date in datepicker I would like to create a simple web page, where user can select a picture by choosing date in datepicker. The picture filenames consist date string. For example: img-2018-06-24.png. So far, I could get work this datepicker example: <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI Datepicker - Default functionality</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <script> $(function() { $( "#datepicker" ).datepicker(); //selecting the button and adding a click event $("#alert").click(function()...

center elements within a polygon div container

center elements within a polygon div container currently I have a div container with text in it. div { height: 200px; background: red; } p { text-align: center; } <div> <p> Text goes here </p> </div> and I want this div container being a parallelogram with a vertically centered text in it. div { height: 200px; background: red; clip-path: polygon(0 25%, 100% 0, 100% 25%, 0 50%); } p { text-align: center; } <div> <p> Text goes here </p> </div> as you can see here, the text completely disappears because the css only works for the div container. How can I make the text appear in the vertical center of this parallelogram? Edit: I don't know if using clip-path: polygon(0 25%, 100% 0, 100% 25%, 0 50%); is the best way to create a div container that is skew. 1 Answer 1 Use gradient to create the shape as background and you sim...

XPath to pick an element based on the text in parent or any of its child

XPath to pick an element based on the text in parent or any of its child Is there a way to pick an element if that element or any one of the child has a particular text? For example, Here are two examples: Example 1: <div title='Title1'> <input type='checkbox'> "Tag 1" </div> Example 2: <div title='Title2'> <input type='checkbox'> <span>Tag 1<span> </div> I want to pick tag div regardless if the text is inside the span or not. But the below XPath picks the tag span for the second case. //*[(contains(text(), 'Tag 1'))] Is there any better XPath to pick the div based on the text inside the parent or any of the child? 1 Answer 1 Is there any better XPath to pick the div based on the text inside the parent or any of the child? Use . , not text() . . text() //*[contains(., 'Tag 1')] text() d...

How to save E-mails from Comment

How to save E-mails from Comment i am very new with html/css too with php and my English is very poor.. so , my problem ... , i have this code: <?php date_default_timezone_set('Europe/Paris'); $content = ""; if(file_exists("messages.inc.html")) $content = file_get_contents("messages.inc.html"); if(isset($_POST['post'])) { $time = date('Y-m-d H:i:s'); $content .= "n<b>From:</b> " . htmlspecialchars($_POST['name']) . " <b>eMail:</b> " . htmlspecialchars($_POST['email']) . " <b>at:</b> $time<br><br>" . htmlspecialchars($_POST['text']) . <"hr">; file_put_contents("messages.inc.html", $content); } ?> <!DOCTYPE html> <html lang="de"> <head> <meta charset="utf-8"> <title>Message schreiben</title> </head> ...

printing data a specific number of times with respect to a const and string length Let there be a sring $str with any number of characters and $cons=25 , also $rest=$cons-strlen( $str ) . $str $cons=25 $rest=$cons-strlen( $str ) Now i wanted to print the string inside boxes so i made a loop where it catches the characters inside the string and echo it inside a div with class w3-border Css: .w3-border { border: 1px solid #f1e1d4 !important; width:16px !important; height:25px; border-collapse: collapse; float: left; } Php: echo'<div class="w3-container" style="margin-bottom:5px !important">'; $str = $row['address']; $strlen = strlen( $str ); $rest=$cons-$strlen; echo'<div class="w3-left" style="width:150px">Address</div>'; for( $i = 0; $i <= $strlen; $i++ ) { $char = substr( $str, $i, 1 ); echo '<div class="w3-border w3-center">'.strtoupper($char).'</div>'; } if...

Position 2 headers in the middle of 2 panel

Position 2 headers in the middle of 2 panel I have this code below that consists of 2 panels and 2 header what i'm trying to accomplish is to put the total fruits header in the middle of the left panel and the other header on the right. But whenever i try to put them in the centre it just messes up the whole thing is there a correct way to do this because i'm not sure how to go about it any suggestion would be greatly appreciated. total fruits var redpill = {}; var greenpill = {}; var randompill = {}; var key = "Red Fruits"; redpill[key] = ['Apple', 'Cherry', 'Strawberry', 'Pomegranate', 'Rassberry', 'Watermelon', 'Durian', 'Avacado', 'Lime', 'Honeydew', 'Watermelon','Apple', 'Cherry', 'Strawberry', 'Pomegranate']; var key2 = "Green Fruits"; greenpill[key2] = ['Watermelon', 'Durian', 'Avacado', 'Lime', '...

Fixed element Y position calculated wrong after scroll on chrome for android Happens when address bar becomes hidden/visible. The element marked on the DOM explorer is the same element shown on the bottom of the screen (with the "Start Planning" button). After scroll it's actual location is being scrolled up (even though it is in fixed position), but no re-rendering occurs since it is still displayed on the screen in the correct position. The interesting thing is that the element does not respond to clicks in the displayed area but rather in the DOM calculated area (aka, if you click above the button it works but not when you click on the button itself). Here is the link the page on our platform that has the issue: https://in-office.wekudo.com/wellness/category/nutrition/smoothie-bar Same issue exists also on Airbnb's platform: https://www.airbnb.com/rooms/select/17017021?search_id=74b85b09-c47b-4d33-854a-c42ffa1d7779&federated_search_id=93685a2b-81cc-49a4-9699-2e...

HTML - form tag bringing you to a website

HTML - form tag bringing you to a website How would you do this with form ()? Make a text box and a Submit button. You type anything in the textbox and Submit will open a website in your browser with a link of: (example) test.com/TextTheyPutHere. Basically, if I put 'lol' in the textbox, it would open a website test.com/lol. Please help. 1 Answer 1 Try this: <!DOCTYPE html> <html> <head> <script> function newDoc() { window.location.assign("http://www.yourVeryOwnSitez.com/"+document.myForm.myDestination.value) } </script> </head> <body> <form method="post" name="myForm"> <input type="text" name="myDestination"> <input type="button" value="Gogogo" onclick="newDoc()"> </form> </body> </html> Then edit line 7 and put your particular url in ...

Responsive, cover-fit image tagging

Responsive, cover-fit image tagging I am working on a project where I have a slideshow with images as follows: img { width:100vw; height:100vh; object-fit:cover; } This makes the images fullscreen and behave like background-size:cover, so they fill out the whole viewport on any screen size without distortion. I would like to tag certain points with text tooltips on these images. For this purpose I have found Tim Severien's Taggd, which works great on responsive images, but in my case the object-fit:cover; property makes the tagged positions inaccurate. object-fit:cover; I have tried everything from CSS hacks to improving Tim's code, but I am out of ideas. If you have any solution or workaround in mind please share. Thank you! 2 Answers 2 well i actually wanted to do the same thing. here is what i've done. maybe it will help someone in the future. it would be great if this fe...

jquery replace menu item text on hover

jquery replace menu item text on hover I have the following simple nav menu (there are no sub-menu items) and I need the text of each menu item to change upon hover. The default text is in the a href tags, the hover text is in the data-item attribute. I've tried variations of some jQuery code posted here, but I'm not getting it right. Any help would be appreciated. HTML <ul id="menu"> <li class="menu-item" data-item="Research"><a href="#research">01/08</a></li> <li class="menu-item" data-item="Awards"><a href="#awards">02/08</a></li> <li class="menu-item" data-item="Education"><a href="#education">03/08</a></li> <li class="menu-item" data-item="Publications"><a href="#publications">04/08</a></li> </ul> jQuery: $('li > .me...

When new image is created, image.width returns 0

When new image is created, image.width returns 0 The code below says that spike.image.width = 0 . Why is this? I'm probably missing something that is obvious. spike.image.width = 0 class Spike { constructor(x = 200, y = 200) { this.x = x; this.y = y; this.image = new Image(); this.image.src = "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSIBO-v6hQoEBhzmZ05mKzgYqrsZ0svgsED7IDR4dIVNxc78uc2"; } } const ctx = document.getElementById("canvas").getContext("2d"); const spike = new Spike; console.log(spike.image.width); <!DOCTYPE html> <html> <head> <link href="css/default.css" rel="stylesheet" /> </head> <body> <canvas id="canvas" width="400" height="600"></canvas> <script src="js/main.js"></script> </body> </html> 1 Answer ...

my function() is not working or the value is not converting to a number

my function() is not working or the value is not converting to a number Been stuck here ALL day long trying to figure out what is wrong with my syntax. Here’s my code… I’d like to verify if Number1 is > than Number 2 . However, whenever I tried to run the code I always getting false. Please help me.. PS. I am new to coding :( var num1 = document.getElementById('num1'); var num2 = document.getElementById('num2'); var x = Number(num1); var y = Number(num2); function higherThan(x, y){ x > y? alert(true) : alert(false); } Numb1: <input type="number" id="num1"><br> Numb2: <input type="" id="num2"><br> <button onclick="higherThan();">Is Higher Than?</button> document.getElementById('num1') gets the whole element. Change it to document.getElementById('num1').value to get the value – Manually Overridden ...

elements with background-attachment: fixed don't behave same on mobile as on desktop

elements with background-attachment: fixed don't behave same on mobile as on desktop Seems like this issue is known for few years already. I tried to apply blurred background to inside elements with class " .blurred-bg " as per this example https://codepen.io/ariona/pen/geFIK . It has one clear-version image applied as background of body element and blurred-version of same image is applied to elements with class .blurred-bg . .blurred-bg .blurred-bg Here is my code do you know, what can I try to make it work? <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>blurred background sablona</title> <style> body { margin: 0px; padding: 0px; background-image: url("https://lh4.googleusercontent.com/-3eBjuQpOGFw/U47yh_-OycI/AAAAAAAAI2U/uaU5pK49N1w/s1600/normal.jpg"); background-repeat: no-repe...

How do I change this fill gradient from bottom to top

How do I change this fill gradient from bottom to top <svg width="100" height="50" version="1.1" xmlns="http://www.w3.org/2000/svg"> <style type="text/css"> rect{fill:url(#MyGradient)} </style> <defs> <linearGradient id="MyGradient"> <stop offset="5%" stop-color="#F60" /> <stop offset="95%" stop-color="#FF6" /> </linearGradient> </defs> <rect width="100" height="50"> </svg> I want #F60 to be the bottom and #FF6 to be the top and i dont want to rotate it .. I never worked with svg but, can't you just switch the 'stop' lines? – M. Gara Jul 1 at 5:38 ...

HTML page consuming lots of RAM

HTML page consuming lots of RAM Memory usage is high, but nothing is shown. The page keeps loading. <html> <title>Array</title> <body onload="myFunction()"> <center> <p id="demo">This is an array</p> </center> <script> var globe; var i = 0; function myFunction() { var sl = ["a", "b", "c", "d", "d", "e", "f"]; for (i = 0; i < 7; i) { globe = sl[i]; setTimeout(pk, 50); } } function pk() { document.write(globe); i++; myFunction(); } </script> </body> </html> Can someone please explain to me, what's really happening in this script? for (i = 0; i < 7; i) will run forever – CertainPerformance Jul 1 at 4:39 ...

How to make content wrapper “on top” of css grid

How to make content wrapper “on top” of css grid I'm working on a site layout using a two-column CSS grid, which looks somewhat like this. It works fine and all the content centers perfectly in each div. The cells with "bg" just have a background image. Each grid cell "touches" the borders of the browser window. +--------+--------+ | text | bg | +--------+--------+ | bg | text | +--------+--------+ | text | +-----------------+ However, is there an easy way to wrap & center the content so that it doesn't go beyond a certain width? I could target individual paragraphs to align left or right depending on their cells, but I was wondering if there's a more elegant way to do this? The brackets are the "wrapper". +--------+--------+ | [text| bg] | +--------+--------+ | [bg |text] | +--------+--------+ | [ text ] | +-----------------+ Please post the code you have tried. ...

how to check if a div is empty

how to check if a div is empty Hello I have a div that has some content inside of it but when its empty I want it to say something like div is empty heres my code <div class="results">Hello</div> Just a simple google search yielded me this html-tuts.com/… – Vineet Jul 1 at 4:08 Possible duplicate of Check if the content of a DIV is empty in jQuery – Developer kt Jul 1 at 4:14 Please take the time to comment on the answers you received. – connexo Jul 1 at 4:24 7 Answers ...