I made a website project.
But now i meet a problem.
I cannot get the path of css and js file no matter what I do.
Just like this:
<link type="text/css" rel="stylesheet" href="ckplayer/css/ckplayer.css" />
<script type="text/javascript" src="ckplayer/js/ckplayer.min.js" charset="UTF-8"></script>
And
<link type="text/css" rel="stylesheet" href="/ckplayer/css/ckplayer.css" />
<script type="text/javascript" src="/ckplayer/js/ckplayer.min.js" charset="UTF-8"></script>
And
<link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}\ckplayer\css\ckplayer.css" />
<script type="text/javascript" src="${pageContext.request.contextPath}\ckplayer\js\ckplayer.js" charset="UTF-8"></script>
What should I do?Any help would be appreciated.
The folder structure is as follow:
ckplayer
[1]: css (1)ckplayer.css
[2]：js (1)ckplayer.js
2.pages
[1]:video
(1)video.jsp
Seems like your second try should work based on the folder structure you are showing. Hard to say for sure.
If your page is at:
/pages/video/video.jsp
then
/ckplayer/css/ckplayer.css
looks correct as they both reference from the root.
Related
I added the advag module and it seems to be combining files, but noticed this:
<link type="text/css" rel="stylesheet" href="/sites/default/files/advagg_css/css__sqX0oV0PzZnon4-v--YUWKBX0MY_EglamExp-1FI654__IOPiOtulrIZqqAM0BdQCjTz3N2n6srsVUk6UjqwYEZ0__5y1bpT1aXe8cG3wqlISSnUVr8eB3ifViQaWktQUOMrU.css" media="all" />
<link type="text/css" rel="stylesheet" href="/sites/default/files/advagg_css/css__1bGi9mT6hqx9o6nD5bJXmoSMpEPHhptLYP525xD_0e0__8xO7pFjt9gkiLqNXp1T5pf1qVx1B3E4JiRdo_bonpCk__5y1bpT1aXe8cG3wqlISSnUVr8eB3ifViQaWktQUOMrU.css" media="all" />
<link type="text/css" rel="stylesheet" href="/sites/default/files/advagg_css/css__WYBdBM69hbZ67HwkvEm3Klcgr0gEMg-hTDrv-ofiu_0__UJzap9vYL6P5WufuIpZ4HrhEDqpuUpzKBitKuUMmMwY__5y1bpT1aXe8cG3wqlISSnUVr8eB3ifViQaWktQUOMrU.css" media="all" />
<link type="text/css" rel="stylesheet" href="/sites/default/files/advagg_css/css__dC61ke986faoUib_CT99MB7tZjBA8yWX9ATTkjpTWyw__Vi6qRHAK9JP9CJy6hO-AskwMgX7bln4vsoJjDBzEOnE__5y1bpT1aXe8cG3wqlISSnUVr8eB3ifViQaWktQUOMrU.css" media="all" />
<script type="text/javascript" src="/sites/default/files/advagg_js/js__OFsSsQzSaj6v-Oy0a_SsA80EpScOeUbJnZ4cKkiFU9o__uGtSosYSD4fR0mdlliQtbwJx0EbabeubaVWqq2KIlTA__5y1bpT1aXe8cG3wqlISSnUVr8eB3ifViQaWktQUOMrU.js"></script>
<script type="text/javascript" src="/sites/default/files/advagg_js/js__ZnLWb-BTdQmjePHZT3a_HE5Vg9BrAL8v6h1eu0z7Eek__4LsSbjnjVeap6QGx4vvBE7-WJQUGh3gN1gnMb0Bjh48__5y1bpT1aXe8cG3wqlISSnUVr8eB3ifViQaWktQUOMrU.js"></script>
<script type="text/javascript" src="/sites/default/files/advagg_js/js__bf0eTJ6iQnY3GsZO7jbyMczh0IjbGhGwoHB8QRMrO6M__JT_BtjvKQ3w-jLHLX6W2O9rJXNxR4c_rolkuXQfBusU__5y1bpT1aXe8cG3wqlISSnUVr8eB3ifViQaWktQUOMrU.js"></script>
<script type="text/javascript" src="/sites/default/files/advagg_js/js__PdS3RA9MOoQrUBcBhAkRohLUbcIwqBt3WT-iQ0WBYYM__J5JCc-DaME9iOvxgHsman1xajK_HcsQnORtLYdyva5g__5y1bpT1aXe8cG3wqlISSnUVr8eB3ifViQaWktQUOMrU.js"></script>
<script type="text/javascript" src="/sites/default/files/advagg_js/js__hrgDaYfGryCYs0RZQAb5BmgzuYw72p8FV3Uo4YGA-no__Osy32LqTRLSPiyOxYFNLa9K5k3YtrwL2yGKmO4sq_74__5y1bpT1aXe8cG3wqlISSnUVr8eB3ifViQaWktQUOMrU.js"></script>
Why is Drupal Advag creating multiple files and not just one? And how do I fix it?
Out of the box AdvAgg will mimic what core does; you need to configure it act how you want it to. On the admin/config/development/performance/advagg page uncheck "Use cores grouping logic". A really good guide on how to get your site to load faster is this issue for using AdvAgg on drupal.org: https://www.drupal.org/node/2493801
I am very new to using templates. My CSS is not working if I put my html in another folder.
I have realised the css was being applied through JavaScript which I am also new too. I have guided the link for css/js the correct folders and files but it still wont work.
The relevant files are /Linear/index.html and /Linear/builds/index.html(where the error is) and the js and css folders
https://www.dropbox.com/s/cmmdybvbhvff0w4/Linear.zip?dl=0
In your template used skel.js and the style base path defined into it. So if you want your other html file that exist in other child folder work well, you must change the skel.js file.
Also in your index.html file used "noscript" tags. Its mean is if your browser dose not support JavaScript then load the css file, So if you remove this tags it works well like file that exist in root Folder.
<script type="text/javascript" src="../js/skel.min.js"></script>
<script type="text/javascript" src="../js/skel-panels.min.js"></script>
<script type="text/javascript" src="../js/init.js"></script>
<link rel="stylesheet" href="../css/skel-noscript.css" />
<link rel="stylesheet" href="../css/style.css" />
<link rel="stylesheet" href="../css/style-desktop.css" />
</head>
Removing the noscript tag around the css link will solve this;
So, instead of
<noscript>
<link rel="stylesheet" href="../css/skel-noscript.css" />
<link rel="stylesheet" href="../css/style.css" />
<link rel="stylesheet" href="../css/style-desktop.css" />
</noscript>
You have;
<link rel="stylesheet" href="../css/skel-noscript.css" />
<link rel="stylesheet" href="../css/style.css" />
<link rel="stylesheet" href="../css/style-desktop.css" />
You can download the modified version here
https://www.dropbox.com/s/lewnpt0iy980i53/Linear-Modified.zip?dl=0
I have searched for an answer over and over again, but I can't seem to figure this one out. I want to simply use fancybox to show an image.
This is the first time I use fancybox, so probably someone experienced will notice the problem within seconds.
I've followed the steps given at http://fancyapps.com/fancybox/.
This is the code I have in my head.php file:
<!-- Add jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<!-- Add fancyBox -->
<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>
<!-- Optionally add helpers - button, thumbnail and/or media -->
<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-buttons.css?v=1.0.5" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>
<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
This is copied from the given website.
I'm using the exact samen folder-name "fancybox", so I think that can't be the problem.
In my code where I want to load an image, this is what I have:
echo'<a class="fancybox" rel="group" href="img/products/'.$row['bestandsnaam'].'"><img class="img-thumbnail" src="img/products/'.$row['bestandsnaam'].'" alt=""></a>';
After loading this page, I have this code (also copied from the given website):
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
Yet when I click this image, it won't open in fancybox, but it opens in a new tab instead only showing the image without any fancy styling.
Thanks for your help in advance!
This is most assuredly due to your files not being in the place your links are pointing to.And you should be seeing several errors in the console related to this.
Here is a test page using your code with the urls modified to match the folder layout shown in the image below. As you can see it does work. Therefore, your issue must be due to your urls being incorrect or the files themselves being missing.
This is the code from the test page:
<!doctype html>
<html><head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<!-- Add jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="jquery.mousewheel-3.0.4.pack.js"></script>
<!-- Add fancyBox -->
<link rel="stylesheet" href="source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="source/jquery.fancybox.pack.js?v=2.1.5"></script>
<!-- Optionally add helpers - button, thumbnail and/or media -->
<link rel="stylesheet" href="source/helpers/jquery.fancybox-buttons.css?v=1.0.5" type="text/css" media="screen" />
<script type="text/javascript" src="source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<script type="text/javascript" src="source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>
<link rel="stylesheet" href="source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" type="text/css" media="screen" />
<script type="text/javascript" src="source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
</script>
</head>
<body>
<?php
$row['bestandsnaam'] = 'images.jpg';
echo'<a class="fancybox" rel="group" href="img/products/'.$row['bestandsnaam'].'"><img class="img-thumbnail" src="img/products/'.$row['bestandsnaam'].'" alt=""></a>';
?>
</body>
</html>
Folder layout:
I Have Problem With ext-3.3.1 Tree.
I use it in my project but sometimes the browser show this error and fail to load the page.
I take a picture of the errors and It's here and the html is here.
I really think it made by a bug ! anyone can help?
I hope you can help me it really made me mad.
Kind regards
The order of javascript file included in Head tag is important. the order should be like the following:
<script type="text/javascript" src="../../resources/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../resources/ext/ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="../../resources/ext/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="../../resources/ext/resources/css/xtheme-gray.css" />
<link rel="stylesheet" href="../../resources/openlayers/theme/default/style.css" type="text/css" />
<link rel="stylesheet" href="../../resources/app/theme/style.css" type="text/css" />
<script src="../../resources/openlayers/build/OpenLayers.js"></script>
<script src="../../resources/geoext/build/GeoExt.js"></script>
I was originally just using JSFiddle, but I wanted to move my project over to Notepad++ so I could have the files on my computer. The problem is, my Javascript on my page is not going into effect.
Heading Code:
<head>
<link href="C:/HTML/App/app.css" type="text/css" rel="stylesheet" />
<script type='text/javascript' src='C:/HTML/App/app.js'></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
</head>
Any reason why? It links to my style sheet just fine, but my app.js does not seem to be working.
Three things:
app.js uses jQuery so the jQuery file needs to be included first
Also, you said you're running this on your PC. You could be using localhost, but if you're running from file://, src="//... won't work because your browser will be looking for file://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js instead of http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js so all you need to do is add the http:
But did you mean jQuery not jQuery UI? (Thanks #ahren)
<head>
<link href="C:/HTML/App/app.css" type="text/css" rel="stylesheet" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<!-- <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script> -->
<script type='text/javascript' src='C:/HTML/App/app.js'></script>
</head>
Jquery comes first, like so:
<head>
<link href="C:/HTML/App/app.css" type="text/css" rel="stylesheet" />
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script type='text/javascript' src='C:/HTML/App/app.js'></script>
</head>