Are there any problems putting the Javascript includes before CSS includes in a PHP site?
I am finally redoing my business website. It is all PHP, database driven. Everything is working correctly but if I put the javascript Include after the CSS Include in the header Live View will not reflect any changes in the images in the style sheets if they are driven by Javascript.
Here's the example, not working in Live view is the first block of code:
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Home Page</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<!-- CSS -->
<?php include('mstrIncludes/css.php') ?>
<!-- Js -->
<?php include('mstrIncludes/js.php') ?>
</head>If I reverse the order like this Live View works.
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Home Page</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<!-- Js -->
<?php include('mstrIncludes/js.php') ?>
<!-- CSS -->
<?php include('mstrIncludes/css.php') ?>
</head>The PHP include files look like this:
// The css.php File
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/ionicons.min.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/responsive.css">
// the js.php File
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>
<script src="js/bootstrap.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/min/waypoints.min.js"></script>
<script src="js/jquery.counterup.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
If I use Opt + F12 to preview the page in a browser there are no problems with having the <?php include('mstrIncludes/js.php') ?> file after the linked css file, which is more standard.
I think this is just a bug in the way Dreamweaver calculates the Live panel inside the app. There is no problem if I replace the <?php include code with the actual script files. For some reason, Dreamweaver is rendering the scripts before it looks at the CSS. The only other thing I can think of is that the order in which the javascript is read by Dreamweaver may be causing the problem.
Anyway, it's annoying and it only took me about 4 hours to figure out why Live would not work in Dreamweaver but worked fine in my local testing server and on the web.
Thank you.
AdChoices