Put styles in stylesheet, and use semantic markup.
It's easier to think about the problem if it is a list of input controls.
You would most probably want to reset the hidden inputs, because in case a previous input value is removed, and then the form is submitted, those hidden input values would still get included.
Adding a listener on a form propagates it ...
It would be better to do your evaluation only for the particular elements that could be affected each time rather than to reevaluate all of them on any change in any input.
We can rewrite this to pass along the element that triggered the event and the ID of the element that we want to update the style on. Take a look at this:
var ajax = new XMLHttpRequest();
ajax.open('POST', 'ajax.php?action=submit_form', true);
You can replace XHR with fetch. While XHR is widely supported, fetch is easier to work with. It uses promises instead of callbacks, which means you can readily use async/await with it. It's inspired from jQuery's $.ajax(). So if you're familiar with that, fetch will ...
This code appears to function correctly but I wouldn't use it in production unless it is cleaned up. See the suggestions below.
The first five variables are declared as globals:
Neither the fixed position of the header nor the positioning of the background image is achievable with flexbox.
You can replace fixed with sticky. This fixes the offset of the background image for .hero (sticky effects the flow of elements). This also allows us to drop the width attribute which is incorrectly set to width: 100% (should be width: calc(100% -...
If you want the header to be "sticky" the only way is to make it position:fixed. In order to to push the rest of the content down, you need to know the headers height. Then you set a margin-top to your #hero.
I had a similar problem and independently came up with a very similar solution, which I suppose at least confirms that this isn't a totally crazy idea. After seeing your solution, I incorporated parts of it into mine.
First, some comments:
This is risky, to say the least. I wouldn't rely on all browsers doing sensible things with such ...
I don't completely understand your code, which can be a problem when reviewing it, but I think I can get quite far.
Let me start with the two functions, promote() and demote(), that are at the center of your code. There are several things I notice straight away:
Both functions are, apart from an + or - sign, identical. There's a well known principle in ...
I did some testing and research on this, AFAIK your script is safe.
However, you should also be aware of how you retrieve the input. For example, what if the String contained a ", followed by executing PHP code. This would be an even worse vulnerability than malicious client-side code.
This post states old versions of IE may be vulnerable if your char-set ...
I don't know how stable the precise HTML structure of those pages is, could that change in the future? Using a HTML parsing library might be a more robust approach.
Some remarks concerning the Swift implementation:
Don't force-unwrap optionals. If one of the searched strings is not found, your program will terminate with a runtime error. Use optional ...
All looks good as a start, I would advise on sticking the footer to the bottom of the page using the following piece of css.
This will affect the positioning of the text but that can be remedied by setting the position to fixed on the right div to realign it to the right of the page.
Avoid explicitly constructing QString and QStringLiteral objects
In many cases, it's totally unnecessary to explicitly write QString("...") or QStringLiteral("..."). Constant string literals will be implicitly converted to QString in many cases. Also, while QStringLiteral might avoid a copy in some cases, it looks like premature optimization to me. So for ...