Why Does This Not Work in a Normal Browser?


#1

Hi why does this code not work in normal browser?


8/13 Electr(on)ic Slide CSS Bug, Workaround!
#2

What's not working?

What do you mean by "normal browser"? What browser are you using and are you trying to do this in the Codecademy environment?

I'll see if I can help, the more detail the better.


#3

Hi,
Thank you for the reply.

I have saved the index.htm, stylesheet.css and script.js files on my local computer with the codes in it. now I trying to run index.htm on Chrome browser. But all it shows is an empty screen.

Why is it not showing the same results as in the Codeacademy demo browser window?


#4

Hmm this is a little over my pay grade but I can mess around with it tomorrow when on computer. I've never tried doing that before.

Seems like the HTML isn't connecting to the CSS and JS for some reason. They're all in the same folder?


#5

Yes they are. I tried it even on Mozzila Firefox browser with Firebug extension.

It recognizes both HTML and CSS but not the script.

I am a beginner at JS and Jquery. Your help comes as a big relief.

Thank you.


#6

@akhilization
@jballin
You will have to expand your index.html file

HTML

<!DOCTYPE html>
<html>
    <head>
        <title></title>
       <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
       <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
       <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
       <script type="text/javascript" src="script.js"></script>
       <link rel="stylesheet" type="text/css" href="stylesheet.css"/>
    </head>
    <body>
        <div></div>
    </body>
</html>

#7

@leonhard.wettengmx.n: Thanks a lot...now it works, perfectly

@jballin: Thanks to you as well for helping me immensely.


#8

@akhilization
You must remember that during the index.html load
the link's are loaded sequentially
so the 2nd link might overwrite/redefine =functions= from ".js" or ".css" links

Your ".js" and ".css" should be the last to be loaded....
http://stackoverflow.com/questions/1795438/load-and-execution-sequence-of-a-web-page

google search
== the Book ==
jquery [your question] site:developer.mozilla.org
CSS [your question] site:developer.mozilla.org
javascript [your question] site:developer.mozilla.org
[your question] site:jquery.com
[your question] site:getbootstrap.com

== discussions / opinions ==
jquery [your question] site:stackoverflow.com
CSS [your question] site:stackoverflow.com
javascript [your question] site:stackoverflow.com

== guidance ==
www.crockford.com
[your question] site:crockford.com
- - http://javascript.crockford.com/code.html << Javascript coding convention
- - http://javascript.crockford.com/survey.html

http://stackoverflow.com/questions/1795438/load-and-execution-sequence-of-a-web-page
http://www.w3schools.com/jquery/trysel.asp
http://www.w3schools.com/jquery/jquery_ref_selectors.asp
++ bootstrap
http://getbootstrap.com/getting-started/
http://getbootstrap.com/2.3.2/components.html
We now have .col-xs (phones), .col-sm (tablets), .col-md (desktops), and .col-lg (large desktops).

https://learn.jquery.com/events/event-delegation/
event- bubbling or Capturing
event bubble-up or trickle-down
http://stackoverflow.com/questions/4616694/what-is-event-bubbling-and-capturing
https://www.codecademy.com/articles/http-errors-404
https://www.codecademy.com/articles


#9

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.