javascript - Countdown clock works properly offline but doesnt work online -
i have countdown clock on front page displays when view html file offline on server doesnt work. on server displays clock random numbers scattered across page. here index.html. clock div called dw_clock
. in hero section i've tried changing positioning of stylesheets in header. i've tried putting css in html code still have issues. made file 2 style sheets see if google chrome 'inspect element' see flipclock.css
doesnt seem see it, normal style.css
.
<!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <!-- ================================= stylesheets ================================= --> <!-- bootstrap --> <link rel="stylesheet" href="css/bootstrap.min.css" /> <!-- web fonts --> <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic" /> <!-- icon fonts --> <link rel="stylesheet" href="css/font-awesome.min.css" /> <link rel="stylesheet" href="css/simple-line-icons.min.css" /> <!-- other styles --> <link rel="stylesheet" href="css/animate.min.css" /> <link rel="stylesheet" href="css/owl.carousel.min.css" /> <link rel="stylesheet" href="css/nivo-lightbox.min.css" /> <link rel="stylesheet" href="css/nivo-lightbox/default.min.css" /> <!-- main styles --> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/flipclock.css"> <!--[if lt ie 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <!-- colors --> <link id="color-css" rel="stylesheet" href="css/colors/green.css" /> <!-- <link id="color-css" rel="stylesheet" href="css/colors/turquoise.css" /> --> <!-- <link id="color-css" rel="stylesheet" href="css/colors/blue.css" /> --> <!-- <link id="color-css" rel="stylesheet" href="css/colors/purple.css" /> --> <!-- <link id="color-css" rel="stylesheet" href="css/colors/pink.css" /> --> <!-- <link id="color-css" rel="stylesheet" href="css/colors/red.css" /> --> <!-- <link id="color-css" rel="stylesheet" href="css/colors/orange.css" /> --> <!-- <link id="color-css" rel="stylesheet" href="css/colors/yellow.css" /> --> <!-- jquery --> <script src="js/jquery-1.11.1.min.js"></script> </head> <body class="with-preloader"> <!-- ================================= preloader ================================= --> <div id="preloader" class="preloader"> <div class="preloader-inner"> <span class="preloader-logo"> <img src="images/logos/preloader-logo.png" alt="eos" /> <strong>loading</strong> </span> </div> </div> <div id="document" class="document"> <!-- ================================= hero section ================================= --> <section id="home" class="hero-section hero-layout-2 section parallax-background" data-stellar-background-ratio="0.4"> <!-- background overlay --> <div class="black-background-overlay"></div> <div class="container"> <div class="hero-content"> <!-- hero text --> <div class="hero-text"> <!-- logo --> <div class="hero-logo wow fadein" data-wow-duration="1s"> <img src="images/logos/hero-logo.png" alt="eos - app landing page template" /> </div> <!-- tagline --> <h1 class="hero-title wow fadeinup" data-wow-duration="1s">coming soon</h1> <div class="dw_clock wow fadeinup" data-wow-duration="1s"></div> <!-- watch video --> <a href="#subscribe" class="hero-watch-video-link anchor-link wow fadeinup" data-wow-duration="1s" data-wow-delay="1s"><i class="fa fa-plus"></i>notify me when rhevon released</a> </div> </div> </div> </section> <!-- ================================= footer section ================================= --> <footer class="footer-section section" section id="contactus"> <!-- copyright --> <div class="copyright">copyright © . rights reserved</div> </div> </footer> </div> <!-- ================================= javascripts ================================= --> <script src="js/flipclock.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/retina.min.js"></script> <script src="js/smoothscroll.min.js"></script> <script src="js/wow.min.js"></script> <script src="js/jquery.nav.min.js"></script> <script src="js/nivo-lightbox.min.js"></script> <script src="js/jquery.stellar.min.js"></script> <script src="js/owl.carousel.min.js"></script> <script src="js/script.js"></script> </body> </html>
can please me, if needed can upload style.css file , flipclock.css file (that file gives clock needed styling) have taken out of sites code stackoverflow wont allow me post because have code, removed header, dont think issue coming there, , i've not included metadata, page title, or favicon
it's file casing.
change file name http://www.rhevon.com/css/flipclock.css
and work.
as mentioned file names case sensitive on linux, why had working in local windows environment. file name 'flipclock.css' not 'flipclock.css'.
don't forget mark valid answer, if helped you.
Comments
Post a Comment