The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

2 Pages V  1 2 >  
Reply to this topicStart new topic
> Preloader Interfering With Navigation
DavidLeon
post Jul 19 2020, 09:37 AM
Post #1





Group: Members
Posts: 5
Joined: 19-July 20
Member No.: 27,443



My Webpage

The template I'm using has a preloader which I think may be interfering with navigation. I have .pls files streaming music in the Menu under Radio. When I click on them to listen it loads them fine but the page goes to the preloader (which I would just as well get rid of anyway) and I have to reload the page for it to come back. I've tried to just get rid of the preloader and it's like some alien entity that can't be killed. I tried removing it from javascripts and css as well as the page itself. Then my links don't work at all. I can't navigate anywhere on my page or listen to the .pls files.

Isn't that the oddest thing? I've never run into this before.

Thanks for any help you can give me and for your attention.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Jul 19 2020, 12:35 PM
Post #2


.
********

Group: WDG Moderators
Posts: 8,587
Joined: 10-August 06
Member No.: 7



The page seems to be made up almost entirely of javascript, so I move the thread to the javascript forum.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jul 19 2020, 01:46 PM
Post #3


Programming Fanatic
********

Group: Members
Posts: 1,787
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



I would try validating the CSS first, there are a few dropped rules due to bad selectors. Validate the CSS here.

It's also a good idea to validate the HTML also. You can do that here.

This post has been edited by CharlesEF: Jul 19 2020, 01:48 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
DavidLeon
post Jul 19 2020, 02:40 PM
Post #4





Group: Members
Posts: 5
Joined: 19-July 20
Member No.: 27,443



QUOTE(CharlesEF @ Jul 19 2020, 02:46 PM) *

I would try validating the CSS first, there are a few dropped rules due to bad selectors. Validate the CSS here.

It's also a good idea to validate the HTML also. You can do that here.


Okay. I validated the CSS and it validates, except they recommend I not close the image tag for the logo which I fixed and it validates. Supposed to be css, though, I don't understand why it would comment on the html page.

I tried to validate the HTML and it suggested I change the <html> tag with language, which I did and then they have a list of errors evolving the head tag which they seem to be indicating doesn't exist. It does.

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jul 19 2020, 03:30 PM
Post #5


Programming Fanatic
********

Group: Members
Posts: 1,787
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Your HTML is invalid. The basic structure of an HTML document is:

<!DOCTYPE HTML>
<html lang="en">
<head>
</head>
<body>
</body>
</html>

In the head section is where you should place all meta, title, link and script tags. Your current code doesn't follow this.
You also seem to have an out of place </td>, which is after a closing </tr>. That is wrong, the table cell should be closed first.
And I see you are using the <center> tag but that was removed in HTML 5.

Your CSS still has errors, according to Firefox. Example: Unrecognized at-rule or error parsing at-rule ‘@-ms-viewport’, Unknown pseudo-class or pseudo-element ‘-ms-expand’. Ruleset ignored due to bad selector, there are more like this. All the errors are from core.css

Your browser should have some kind of 'Web Developer' option where you can look at the console and see these errors.

This post has been edited by CharlesEF: Jul 19 2020, 03:46 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
DavidLeon
post Jul 19 2020, 11:04 PM
Post #6





Group: Members
Posts: 5
Joined: 19-July 20
Member No.: 27,443



QUOTE(CharlesEF @ Jul 19 2020, 04:30 PM) *

Your HTML is invalid. The basic structure of an HTML document is:

<!DOCTYPE HTML>
<html lang="en">
<head>
</head>
<body>
</body>
</html>

In the head section is where you should place all meta, title, link and script tags. Your current code doesn't follow this.
You also seem to have an out of place </td>, which is after a closing </tr>. That is wrong, the table cell should be closed first.
And I see you are using the <center> tag but that was removed in HTML 5.

Your CSS still has errors, according to Firefox. Example: Unrecognized at-rule or error parsing at-rule ‘@-ms-viewport’, Unknown pseudo-class or pseudo-element ‘-ms-expand’. Ruleset ignored due to bad selector, there are more like this. All the errors are from core.css

Your browser should have some kind of 'Web Developer' option where you can look at the console and see these errors.


I don't understand. First of all the structure of my HTML is exactly as you say it should be. I hadn't heard of the language thing in an html tag. That must be new, but I added it. All meta tags, title and link and script tags are where they should be. True I do use the archaic center tag and the table tags I've changed. Of course, that didn't fix anything. It has nothing to do with it. The validator didn't mention the table tags as being even just a warning.

I did have the charset outside the head but I thought that was the way it's supposed to be. It's hard to keep up with the rules.

As for the CSS, it's validated by the source I was given to validate it and yet you say there are errors in the core? How is that possible?

ETA: Maybe I should rephrase my question. How does one remove a preloader without effecting the functionality of a website?

This post has been edited by DavidLeon: Jul 19 2020, 11:11 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jul 19 2020, 11:56 PM
Post #7


Programming Fanatic
********

Group: Members
Posts: 1,787
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



I will admit that fixing these errors might not solve your problem. I believe the foundation should be solid before you try fixing other things.

I took your 'core.css' and ran it thru the CSS validator and I get errors and warnings reported. There are 30 rules that generate a parse error, 1651 warnings. You should look into the errors, at least.

You want to fix something by removing the 'preloader'. That may work, I'm not sure because I don't use bootstrap at all. Then again it may not work.

I always like to start with a good foundation before I start trying to fix things. You are free to ignore/take my advise.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
DavidLeon
post Jul 20 2020, 06:49 AM
Post #8





Group: Members
Posts: 5
Joined: 19-July 20
Member No.: 27,443



QUOTE(CharlesEF @ Jul 20 2020, 12:56 AM) *

I will admit that fixing these errors might not solve your problem. I believe the foundation should be solid before you try fixing other things.

I took your 'core.css' and ran it thru the CSS validator and I get errors and warnings reported. There are 30 rules that generate a parse error, 1651 warnings. You should look into the errors, at least.

You want to fix something by removing the 'preloader'. That may work, I'm not sure because I don't use bootstrap at all. Then again it may not work.

I always like to start with a good foundation before I start trying to fix things. You are free to ignore/take my advise.


I didn't come here to argue with you I came here for help. I've made the necessary changes the validator suggested in the HTML, then ran it through again and it gives the same errors.

I've ran the core.css through and I get this. http://jigsaw.w3.org/css-validator/validat...ng=&lang=en

Congratulations, no errors!

I can't fix what I can't see and to be honest, if there's 1651 errors I'll go down with the sinking ship. I don't want to take up anyone's time unnecessarily. It just amazes me that I can't simply remove the preloader code. On the HTML page where it appears. A simple line of code. Or at least remove it from the css and java script files.

It just won't go away and no one seems to know why? And I can't help but wonder . . . who makes these website templates? Why are they always so full of errors? And if the errors are so important how is it that the pages work in every browser? Why implement a page of code in css that's going to mess up everything else on a website when a harmless center tag would work better without having to write out all of that code or messing up the entire website? Because some guru somewhere decided the center tag was unfashionable?

I don't get that. I knew you all would insist upon the validation, which is why I used the most stripped down page I had, but I can't fix 1651 errors I can't see or much less understand. I'll just have to live with it. Thanks for your help and sorry to have wasted your time.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 20 2020, 10:58 AM
Post #9


Computer says no.
********

Group: WDG Moderators
Posts: 19,186
Joined: 9-August 06
Member No.: 6



1651 errors? What tool did you use. There are three errors and they are all about required stuff left out.

You need to declare a character encoding, you need a doctype and the page needs TITLE.
https://validator.w3.org/nu/?doc=http%3A%2F...;showsource=yes

I don't know why the w3c validator goes on with the validation without a doctype without telling us what doctype it validates against, but judging from from the warning that the type attribute isn't needed it's HTML 5.

I doubt correcting the errors will fix your problem, but you should do it anyway. The doctype is important because without it browsers run in quirks mode which means they emulate older and more error prone versions of themselves. But what you've got isn't a rendering problem.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jul 20 2020, 02:47 PM
Post #10


Programming Fanatic
********

Group: Members
Posts: 1,787
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Since I don't do bootstrap I'm out of here. I can only say that the link you posted does show a valid CSS file. However, I find that if I copy the CSS text and paste it in to the CSS validator it reports 32 errors and 1649 warnings. That's 2 more errors and 2 less warnings than the last time I validated the CSS. So, when validating by URI it reports success. But, when validating by direct input it reports errors and warnings. Strange, I don't understand why?

Good luck on your problem.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
DavidLeon
post Jul 20 2020, 05:28 PM
Post #11





Group: Members
Posts: 5
Joined: 19-July 20
Member No.: 27,443



QUOTE(CharlesEF @ Jul 20 2020, 03:47 PM) *

Since I don't do bootstrap I'm out of here. I can only say that the link you posted does show a valid CSS file. However, I find that if I copy the CSS text and paste it in to the CSS validator it reports 32 errors and 1649 warnings. That's 2 more errors and 2 less warnings than the last time I validated the CSS. So, when validating by URI it reports success. But, when validating by direct input it reports errors and warnings. Strange, I don't understand why?

Good luck on your problem.


The HTML as well is odd. I fixed all of the errors and warnings that I could see, but they were still registering as errors and warnings that I've fixed. Some of the errors it claimed I had weren't there. I wonder if it has anything to do with my cache. My web host is free and they have a weird (IMO) cache system. So while I'm working on a page I will have to wait 2 days to see the effect. Changed images, for example.

I don't know. I don't really know what I'm doing, I'm just playing around for a hobby. Thanks anyway.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jul 20 2020, 05:56 PM
Post #12


Programming Fanatic
********

Group: Members
Posts: 1,787
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



That's strange indeed. Personally, when people are just learning I try to recommend that they learn the basics. This means no templates, libraries or frameworks.

You might want to look for a bootstrap friendly forum to post your question. I don't think many people here use bootstrap.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 20 2020, 11:10 PM
Post #13


Computer says no.
********

Group: WDG Moderators
Posts: 19,186
Joined: 9-August 06
Member No.: 6



Sorry, I misunderstood. Thought the many errors was with the HTML.

Yes, something is going wrong. For instance you do have a doctype and the validator says you don't. HTML 4.01 at that. Too bad we have a temporary problem with the validator on this site ATM, otherwise we could have used that and maybe found something.

Look at the source the validator prints at the bottom here.
https://validator.w3.org/nu/?doc=http%3A%2F...;showsource=yes

It isn't a letter right. I wondered why Christian said your page was all JS, but this is probably why. He must have validated first off and saw this.

I found one thing (that I don't know what to do with). With JavaScript off I get that never-ending preloader when loading your page, same as we get when clicking one of the links. wacko.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 20 2020, 11:56 PM
Post #14


Computer says no.
********

Group: WDG Moderators
Posts: 19,186
Joined: 9-August 06
Member No.: 6



QUOTE(pandy @ Jul 21 2020, 06:10 AM) *

Too bad we have a temporary problem with the validator on this site ATM, otherwise we could have used that and maybe found something.


Stupid me. I have the offline version.

Here, some proper validation.
CODE

Results for C:\Users\user\Desktop\TEST\DavidLeon.html
Level of HTML: HTML 4.01 Strict

Errors
1.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 12, Character 14:
    there is no attribute CHARSET for this element (in this HTML version)

2.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 12, Character 21:
    required attribute CONTENT not specified

3.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 29, Character 11:
    there is no attribute ID for this element (in this HTML version)

4.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 29, Character 19:
    element HEADER not defined in this HTML version

5.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 40, Character 11:
    there is no attribute CLASS for this element (in this HTML version)

6.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 40, Character 23:
    element NAV not defined in this HTML version

7.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 107, Character 67:
    there is no attribute TARGET for this element (in this HTML version)

8.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 120, Character 9:
    there is no attribute ID for this element (in this HTML version)

9.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 120, Character 32:
    there is no attribute DATA-BACKGROUND for this element (in this HTML version)

10.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 120, Character 41:
     element MAIN not defined in this HTML version

11.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 123, Character 15:
     there is no attribute CLASS for this element (in this HTML version)

12.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 123, Character 67:
     there is no attribute DATA-BACKGROUND for this element (in this HTML version)

13.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 123, Character 124:
     there is no attribute DATA-OVERLAY for this element (in this HTML version)

14.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 123, Character 135:
     element SECTION not defined in this HTML version

15.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 137, Character 20:
     there is no attribute DATA-ANIMATION for this element (in this HTML version)

16.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 142, Character 7:
     element CENTER not defined in this HTML version

17.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 144, Character 9:
     there is no attribute ALIGN for this element (in this HTML version)

18.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 145, Character 12:
     end tag for element TR which is not open; try removing the end tag or check for improper nesting of elements

19.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 145, Character 17:
     end tag for element TD which is not open; try removing the end tag or check for improper nesting of elements

21.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 149, Character 5:
     end tag for CENTER omitted; possible causes include a missing end tag, improper nesting of elements, or use of an element where it is not
     allowed

22.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 140, Character 0:
     start tag was here

23.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 159, Character 11:
     there is no attribute ID for this element (in this HTML version)

24.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 159, Character 19:
     element FOOTER not defined in this HTML version

25.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 168, Character 54:
     required attribute TYPE not specified

26.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 169, Character 55:
     required attribute TYPE not specified


Almost all of those errors are because you really write HTML5, but you use a HTML 4.01 doctype. Lots of new stuff in HTML5, that's seen as unknown elements and attributes in HTML 4.01. Alas the WDG validator doesn't do HTML 5, since HTML 5 doesn't have a DTD.

Ignoring all the HTML 5 related errors it boils down to these, the only real errors.

CODE

16.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 142, Character 7:
     element CENTER not defined in this HTML version

17.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 144, Character 9:
     there is no attribute ALIGN for this element (in this HTML version)

18.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 145, Character 12:
     end tag for element TR which is not open; try removing the end tag or check for improper nesting of elements

19.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 145, Character 17:
     end tag for element TD which is not open; try removing the end tag or check for improper nesting of elements

21.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 149, Character 5:
     end tag for CENTER omitted; possible causes include a missing end tag, improper nesting of elements, or use of an element where it is not
     allowed

22.  C:\Users\user\Desktop\TEST\DavidLeon.html, Line 140, Character 0:
     start tag was here



They are caused by this peculiar bit with wrongly nested closing table tags and and CENTER isn't closed at all (and CENTER isn't allowed, neither in HTML5 nor in 4.01 Strict).

CODE
<div data-animation="fade-in-bottom 1.2s .4s">
<center><table width="60%"><tr><td>

<h3 class="text-light">400 Bad Request</h3>

<p align="justify" class="medium serif my-2 text-light">The 400 Bad Request error indicates that the server cannot or will not process the request due to something that is perceived to be a client error such as a malformed request syntax, invalid request message framing, or deceptive request routing.</p>
</table></tr></td>
</div>



This doesn't solve your problem either, but at least it shows there's basically nothing wrong with your HTML. Apart from the above bit and that you use the wrong doctype.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 21 2020, 12:10 AM
Post #15


Computer says no.
********

Group: WDG Moderators
Posts: 19,186
Joined: 9-August 06
Member No.: 6



The validator hates you. It does the same thing with your whole site. Look for example at the source it uses here.
https://validator.w3.org/nu/?doc=http%3A%2F...;showsource=yes
Again, that's not what's in the real source at all.

I don't understand what's going on. I validated several pages that I know don't have errors and the validator handled them correctly. So I think the problem is with your site, but I can't figure out what it is. But maybe THAT is related to the original problem?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 21 2020, 01:10 AM
Post #16


Computer says no.
********

Group: WDG Moderators
Posts: 19,186
Joined: 9-August 06
Member No.: 6



It isn't only the validator. Other tools get the same crap source, so somehow that's what's sent from your server.

http://www.rexswain.com/httpview.html

Alas that tool doesn't support GET anymore, so can't link directly to the result. And it uses a pesky image CAPTCHA...

Here's one that doesn't require CAPTCHA.
https://www.autark.se/user_agent_simulator.html
Was cool once, but haven't been updated. I set the UA to the newest version of FF it provides, which is old. And look what it gets...
https://www.autark.se/uas.html?url=http%3A%...line-numbers=on

So why do our browsers show a normal HTML source? wacko.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 21 2020, 01:16 AM
Post #17


Computer says no.
********

Group: WDG Moderators
Posts: 19,186
Joined: 9-August 06
Member No.: 6



I think we'd better leave this to Darin. laugh.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Jul 21 2020, 06:11 AM
Post #18


.
********

Group: WDG Moderators
Posts: 8,587
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Jul 21 2020, 06:10 AM) *

Look at the source the validator prints at the bottom here.
https://validator.w3.org/nu/?doc=http%3A%2F...;showsource=yes

It isn't a letter right. I wondered why Christian said your page was all JS, but this is probably why. He must have validated first off and saw this.

I actually viewed it with javascript disabled, but yes that's what I got. It appears the HTML is encrypted by http://daystarbible.epizy.com/aes.js (probably a waste of time, since you can always get the result in your browser's inspector tools, but I didn't bother).
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 21 2020, 07:29 AM
Post #19


Computer says no.
********

Group: WDG Moderators
Posts: 19,186
Joined: 9-August 06
Member No.: 6



QUOTE(Christian J @ Jul 21 2020, 01:11 PM) *

QUOTE(pandy @ Jul 21 2020, 06:10 AM) *

Look at the source the validator prints at the bottom here.
https://validator.w3.org/nu/?doc=http%3A%2F...;showsource=yes

It isn't a letter right. I wondered why Christian said your page was all JS, but this is probably why. He must have validated first off and saw this.

I actually viewed it with javascript disabled, but yes that's what I got. It appears the HTML is encrypted by http://daystarbible.epizy.com/aes.js (probably a waste of time, since you can always get the result in your browser's inspector tools, but I didn't bother).


But when I have JS off I get the loader as I said, but I still see HTML when I view source. Why does this differ?

Even if the whole page is written by JS we all should see JS and not the rendered HTML. How the heck does this work?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Jul 21 2020, 08:31 AM
Post #20


.
********

Group: WDG Moderators
Posts: 8,587
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Jul 21 2020, 02:29 PM) *

But when I have JS off I get the loader as I said, but I still see HTML when I view source. Why does this differ?

Not sure what you mean with "loader", but this is what I see:

CODE
<html><body><script type="text/javascript" src="/aes.js" ></script><script>function toNumbers(d){var e=[];d.replace(/(..)/g,function(d){e.push(parseInt(d,16))});return e}function toHex(){for(var d=[],d=1==arguments.length&&arguments[0].constructor==Array?arguments[0]:arguments,e="",f=0;f<d.length;f++)e+=(16>d[f]?"0":"")+d[f].toString(16);return e.toLowerCase()}var a=toNumbers("f655ba9d09a112d4968c63579db590b4"),b=toNumbers("98344c2eee86c3994890592585b49f80"),c=toNumbers("c3faaf2198683e7f89b06388650e9cf3");document.cookie="__test="+toHex(slowAES.decrypt(c,2,a,b))+"; expires=Thu, 31-Dec-37 23:55:55 GMT; path=/"; location.href="http://daystarbible.epizy.com/400b.php?i=1";</script><noscript>This site requires Javascript to work, please enable Javascript in your browser or use a browser with Javascript support</noscript></body></html>


If you get something else (with JS disabled) maybe there's some server-side browser detection going on as well. unsure.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

2 Pages V  1 2 >
Reply to this topicStart new topic
4 User(s) are reading this topic (4 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 29th October 2020 - 11:41 PM