Please or Register to create posts and topics.

Fiddling with Some HTML and Archiving data

Bestowic@bestowic
163 Posts
#1 · August 20, 2021, 10:06 am

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {box-sizing: border-box;}
body {font-family: Verdana, sans-serif;}
.mySlides {display: none;}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
max-width: 1000px;
position: relative;
margin: auto;
}

/* Caption text */
.text {
color: #f2f2f2;
font-size: 15px;
padding: 8px 12px;
position: absolute;
bottom: 8px;
width: 100%;
text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
color: #f2f2f2;
font-size: 12px;
padding: 8px 12px;
position: absolute;
top: 0;
}

/* The dots/bullets/indicators */
.dot {
height: 15px;
width: 15px;
margin: 0 2px;
background-color: #bbb;
border-radius: 50%;
display: inline-block;
transition: background-color 0.1s ease;
}

.active {
background-color: #717171;
}

/* Fading animation */
.fade {
-webkit-animation-name: fade;
-webkit-animation-duration: .3s;
animation-name: fade;
animation-duration: .3s;
}

@-webkit-keyframes fade {
from {opacity: .9}
to {opacity: 1}
}

@keyframes fade {
from {opacity: .9}
to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
.text {font-size: 11px}
}
</style>
</head>
<body>
<p></p>

<div class="slideshow-container">

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/north_america/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/polar_lt/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/global/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/velocity/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/density/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/pressure/latest.png" style="width:90%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/lasco-c2/latest.jpg" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/lasco-c3/latest.jpg" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-094.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-131.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-171.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-195.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-284.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-304.png" style="width:50%">
<div class="text"></div>
</div>
</div>
<br>

<div style="text-align:center">
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
</div>

<script>
var slideIndex = 0;
showSlides();

function showSlides() {
var i;
var slides = document.getElementsByClassName("mySlides");
var dots = document.getElementsByClassName("dot");
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex > slides.length) {slideIndex = 1}
for (i = 0; i < dots.length; i++) {
dots[i].className = dots[i].className.replace(" active", "");
}
slides[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " active";
setTimeout(showSlides, 2000);
}
</script>

</body>
</html>

Click for thumbs down.0Click for thumbs up.0
○°| Making the world obvious in not so obvious ways connecting patterns and associating Aincent pasts gods as symbolic personification of very complex ideals in physics, atomics, cosmology etc. Taking folklore and learning the subtext the esoterical data preserved in the complex nature like intentional to keep the memory alive over many many many generations. Data is gathered sometimes through a process of creative writing where I'm pretend to believe that unimportant information is vital and relevant and use overactive imagination to understand various outcomes that lead to ultimately accurate conclusions and new ideals no one has considered. Sometimes this process I call being creatively precautious. As you are aware but not simultaneously it's a near manic but not emotional state that's helps me with my esoterical portion of my bestowic behavior. Information metadata seemingly not yet important but truly underlying geometrical and core structure of messages and symbols are relevant. ●•|
smAsh@smash
838 Posts
#2 · August 21, 2021, 7:01 pm

Wth is this?  

Click for thumbs down.0Click for thumbs up.2
Bestowic and robert have reacted to this post.
Bestowicrobert
Regards, Dan, a. k. a. smAshomAsh
robert@1audio
20 Posts
#3 · August 21, 2021, 8:33 pm

bestowic  .. My god What school did you attend? Or did you take more advanced classes during summer break. Symbols can be a language O.K. uhm. From a person who barely uses the English language on a 5 grade level ok 6th I'm making the world obvious in not so obvious ways.( duality) .. The first sentence is complex as it is .. now the fun really starts as you read on my god. lets see if i have a sparkles in my eye about how you were able to write your explanation of the word bestowic  and its  esoterically engrained through preserved data with in a subtext? what a  paragraph! : which you're mastery of proper English and ability to precisely express verbally as set above ideas... out of >.</script> </body></html> this looks like code . I have never observed code before. What else can it be? If you can do this then tell me how many languages do you speak? And how many dialects of each language have you mastered.  I will say it  ,I am Jealous/ envious/  and disgusted with my self . just a bit. If you know the spoken language of a person who is in need of advise .you can hurt or help that induvial; Even save lives . Good for you ! I'm out on a limb and  could have this explanation completely wrong and convoluted. At least I gave it my best.

  You gave us a chance to dive into how your mind interprets symbols mythology folk law thus giving it your  unique perspective and relevance to a set question. I apologize for the kind of emotional reaction I was just taking back by your mastery . Within my response did I hit any correct assumptions I mean was I even in the ballpark I would like to know

Click for thumbs down.0Click for thumbs up.0
Last edited on August 24, 2021, 5:41 pm by robert
Robert LaFollette
Bestowic@bestowic
163 Posts
Topic Author
#4 · December 1, 2021, 9:43 am

Lol u like the signature. lets see here let me figure out what i was going for and get back to ya... copy , open notepad, paste, save as code.html open with brave. o jesus guys you gotta try this... its smashes entire show autopopulating in a slideshow in realtime... not kidding. 

Paste this and save as a .html file and open it.

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {box-sizing: border-box;}
body {font-family: Verdana, sans-serif;}
.mySlides {display: none;}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
max-width: 1000px;
position: relative;
margin: auto;
}

/* Caption text */
.text {
color: #f2f2f2;
font-size: 15px;
padding: 8px 12px;
position: absolute;
bottom: 8px;
width: 100%;
text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
color: #f2f2f2;
font-size: 12px;
padding: 8px 12px;
position: absolute;
top: 0;
}

/* The dots/bullets/indicators */
.dot {
height: 15px;
width: 15px;
margin: 0 2px;
background-color: #bbb;
border-radius: 50%;
display: inline-block;
transition: background-color 0.1s ease;
}

.active {
background-color: #717171;
}

/* Fading animation */
.fade {
-webkit-animation-name: fade;
-webkit-animation-duration: .3s;
animation-name: fade;
animation-duration: .3s;
}

@-webkit-keyframes fade {
from {opacity: .9}
to {opacity: 1}
}

@keyframes fade {
from {opacity: .9}
to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
.text {font-size: 11px}
}
</style>
</head>
<body>
<p></p>

<div class="slideshow-container">

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/north_america/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/polar_lt/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/global/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/velocity/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/density/latest.png" style="width:90%">
<div class="text"></div>
</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/geospace/pressure/latest.png" style="width:90%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/lasco-c2/latest.jpg" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/animations/lasco-c3/latest.jpg" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-094.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-131.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-171.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-195.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-284.png" style="width:50%">
<div class="text"></div>
</div>

</div>

<div class="mySlides fade">
<div class="numbertext"></div>
<img class="autorefresh" align="center" src="https://services.swpc.noaa.gov/images/suvi-primary-304.png" style="width:50%">
<div class="text"></div>
</div>
</div>
<br>

<div style="text-align:center">
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
</div>

<script>
var slideIndex = 0;
showSlides();

function showSlides() {
var i;
var slides = document.getElementsByClassName("mySlides");
var dots = document.getElementsByClassName("dot");
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex > slides.length) {slideIndex = 1}
for (i = 0; i < dots.length; i++) {
dots[i].className = dots[i].className.replace(" active", "");
}
slides[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " active";
setTimeout(showSlides, 2000);
}
</script>

</body>
</html>

Uploaded files:
  • auto.PNG
Click for thumbs down.0Click for thumbs up.0
○°| Making the world obvious in not so obvious ways connecting patterns and associating Aincent pasts gods as symbolic personification of very complex ideals in physics, atomics, cosmology etc. Taking folklore and learning the subtext the esoterical data preserved in the complex nature like intentional to keep the memory alive over many many many generations. Data is gathered sometimes through a process of creative writing where I'm pretend to believe that unimportant information is vital and relevant and use overactive imagination to understand various outcomes that lead to ultimately accurate conclusions and new ideals no one has considered. Sometimes this process I call being creatively precautious. As you are aware but not simultaneously it's a near manic but not emotional state that's helps me with my esoterical portion of my bestowic behavior. Information metadata seemingly not yet important but truly underlying geometrical and core structure of messages and symbols are relevant. ●•|
Back to top