On Monday, 24 May 2021 at 01:24:26 UTC+1, Thomas 'PointedEars' Lahn wrote
(***) too much writing, with not enough thinking.
Andrew Poulos wrote:
On 24/05/2021 1:58 am, John Stockton wrote:
I have not been able to access this newsgroup for a while.
It shows :-D
The following code was written in Firefox, and works there; it is called >> in a script element which immediately follows <BODY>. it puts something >> like
× FREDERIC.HTM - saved @ LCT 2021-05-22 Sat ×
in the bottom right-hand corner of the window.
But it does not work in Chrome, Vivaldi, Opera, AVG Secure Browser, or
Edge.
Of those, Chrome, Opera, _Avast_ Secure Browser, and Edge are now Chromium- based, i.e. use Blink as layout engine. Vivaldi is an attempt to preserve the original Opera’s Presto layout engine.
In IE11, the style setting has no effect, and the unadorned string
appears top right. OS is Windows 10.
IE 11’s layout engine is still MSHTML.
Note:
“Internet Explorer 11 follows the OS component lifecycle,[7] which means it
remains supported with technical and security fixes while operating systems including it as a component are shipped. This means that there is no date for end of support for Internet Explorer 11.[8] On August 17, 2020, Microsoft published a timeline indicating that the Microsoft Teams product would stop supporting Internet Explorer 11 on November 30, 2020, and Microsoft 365 products will end Internet Explorer 11 support on August 17, 2021.[9]”
<https://en.wikipedia.org/wiki/Internet_Explorer_11>
(***) I have seen, somewhere, a recent authoritative statement which indicates much the same dates but about a year later.
[…]
function Show_Age() { // Needs INC-DATE.JS or do not use YMDDstr
var ND = new Date(), LM = new Date(document.lastModified)
if ((ND-LM) > 1500 && +LM > 1e12) {
var El = document.createElement("div")
El.style = "bottom: 0px; right: 0px; position: fixed; background:
silver; width: auto; text-align: center; border-radius: 1ex;
padding: 0.3ex 1.2ex; font-family: sans-serif;"
El.className = "NPR" // assumes styles-a.css
El.appendChild(document.createTextNode("\xD7 " +
location.pathname.replace(/.*\//, "").toUpperCase() +
" - saved @ LCT " + LM.YMDDstr() + " \xD7"))
El.onclick = function() { this.style.display = "none" }
}
document.body.appendChild(El) }
True programmers can write Pascal code in any programming language :-D
Compare: <https://github.com/airbnb/javascript>
Any suggestions?
I don't think you can set an element's style the way you are doing it.
That is correct. “style” is historically a *read-only* *object* property[1], and has been FOR 20 YEARS NOW [2].
Only as per the WHATWG DOM one may assign a string value to it, as a shorthand.[3]
A backwards-compatible possibility would be to set the “style” attribute to
that primitive string value. But it is better to append a stylesheet, and then format based on CSS class names.
That had no effect - neither better nor worse.
[1] <https://developer.mozilla.org/en-US/docs/Web/API/ElementCSSInlineStyle/style>
[2] <https://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/level-one-html.html>
<http://www.w3.org/TR/2000/CR-DOM-Level-2-20000510/html.html#ID-58190037> <http://www.w3.org/TR/2000/CR-DOM-Level-2-20000510/css.html#CSS-htmlelementcss>
[3] <https://html.spec.whatwg.org/multipage/dom.html#the-style-attribute>
Maybe try this
function Show_Age() { // Needs INC-DATE.JS or do not use YMDDstr
var ND = new Date(),
LM = new Date(document.lastModified);
if ((ND-LM) > 1500 && +LM > 1e12) {
var El = document.createElement("div");
El.style.bottom = "0px";
El.style.right = "0px";
El.style.position = "fixed";
El.style.background = "silver";
El.style.textAlign = "center";
El.style.borderRadius = "1ex";
El.style.padding = "0.3ex 1.2ex";
El.style.fontFamily = "sans-serif";
El.className = "NPR"; // assumes styles-a.css El.appendChild(document.createTextNode("\xD7 " + location.pathname.replace(/.*\//, "").toUpperCase() +
" - saved @ LCT " + LM.YMDDstr() + " \xD7"));
El.onclick = function() { this.style.display = "none" }; document.body.appendChild(El);
El = null;
This line is pointless, unless *perhaps* you want to support IE < 7.
}
}
The above can be greatly simplified:
function show_age()
{
var
now = new Date(),
last_mod = new Date(document.lastModified);
if (!((now - last_mod) > 1500 && +last_mod > 1e12)) return;
var el = document.createElement("div");
Object.assign(el.style, {
bottom: "0px",
right: "0px",
position: "fixed",
background: "silver",
textAlign: "center",
borderRadius: "1ex",
padding: "0.3ex 1.2ex",
fontFamily: "sans-serif",
});
el.className = "NPR";
el.appendChild(
document.createTextNode("\xD7 "
+ window.location.pathname.replace(/.*\//, "").toUpperCase()
+ " - saved @ LCT " + LM.YMDDstr() + " \xD7"));
el.onclick = function() { this.style.display = "none" }; document.body.appendChild(el);
}
But, AISB, for a consistent layout it is better to append a stylesheet (if that is supported in the target environments):
let style_source = `.npr2 {
bottom: 0px;
right: 0px;
position: fixed;
background: silver;
width: auto;
text-align: center;
border-radius: 1ex;
padding: 0.3ex 1.2ex;
font-family: sans-serif;
}`;
let style = document.createElement('style');
style.type = 'text/css'; style.appendChild(document.createTextNode(style_source)); document.head.appendChild(style);
el.className = "NPR npr2";
In case it cannot be assumed that template strings are supported, Array.prototype.join() may be used instead to avoid spaghetti code.
---- EOF -----
(*** ...)
"Rem acu non tetigisti" - as PGW might have written, but apparently did not (though a very few others did).
With the original code, most browsers tried would say something like
// Uncaught TypeError: Failed to execute 'appendChild' on
// 'Node': parameter 1 is not of type 'Node'.
// at Show_Age (inc-cmmn.js:60)
// at fred-set.htm:17
from which I subsequently deduced that when createTextNode is fed with a non-string argument it (maybe an undefined one) returns a non-Node of disgust which fatally upsets appendChild. And from that, I thought that the LM of LM.YMDDstr() must actually
be a Date Object in Firefox but not in Chrome, etc. Pragmatically, I tried making LM a Global Variable, and the resulting code worked both in Firefox and in Opera. To avoid an unnecessary Global, I now use new Date(document.lastModified).YMDDstr()
instead, which works in all browsers that I tried except for the Internet Explorer in my Windows 10.
Unfortunately, I want that operation to occur for my current "client", who resides about three metres below me with his Windows 7 PC and is about to receive a Windows 10 PC donated to us yesterday, and who should be given code for the above operation in
his pseudo-home-page, and who is an MS IE fan. However, if it fails harmlessly he'll never know.
I cannot recall why, ages ago, I included the conditionals - so I've commented them out.
Progress has been made.
--
(c) John Stockton, near London, UK. Using Google Groups. |
Mail: J.R.""""""""@physics.org - or as Reply-To, if any. |
--- SoupGate-Win32 v1.05
* Origin: fsxNet Usenet Gateway (21:1/5)