I am trying to add some javascript to my Squarespace site and it isn't working. I'm not sure if the code is correct or if it's just Squarespace.
Here are the two different codes that I'm trying to use:
<script src='http://www.adproval.com/widget/display_ads/1163.js' type='text/javascript'</script>
<div id='adproval-display-DS-38ff23ba6c73c8ccebb9ca5738503cfed38fe373'></div>
<script src='http://www.adproval.com/widget/ad_store/817.js' type='text/javascript'</script>
<div id='adproval-store-817'></div>
You are missing the closing > for the opening <script ...> tag. Also type isin't a required attribute.
Try:
<script src='http://www.adproval.com/widget/display_ads/1163.js'></script>
Related
I included four .js libraries in my html file as below:
<script type="text/javascript" src="js/three.min.js" />
<script type="text/javascript" src="js/stats.min.js" />
<script type="text/javascript" src="js/TrackballControls.js" />
<script type="text/javascript" src="js/TubeGeometry.js" />
But when I executed it on Safari, it messaged that:
'can't find Variable THREE'
which is in three.min.js.
Then I noticed that actually only stats.min.js has been loaded. Can anybody tell me why please? Many thanks in advance!
You can't close <script> tags with single tag <script />. For the <script> tag is mandatory the open and close tag:
<script src="....."></script>
Why? Because your code:
<script src="...."/>
<script src="...."/>
Is saying that the first script is empty and it doesn't, it has the remote content.
You can see more :
https://www.w3.org/TR/xhtml1/#C_3
Element Minimization and Empty Element Content
Given an empty instance of an element whose content model is not EMPTY (for example, an empty title or paragraph) do not use the minimized form (e.g. use <p> </p> and not <p />).
I am new to angularJS. So, may be I am asking very naive question. I have downloaded angularjs 1.3.16 and tried to make a very basic example, which is as given below. When I run in browser(chrome) it doesn't show any thing, while I am expecting, Input text box as well as Hello2 printed by its side.
<html>
<head>
<script src="../angular-1.3.16/angular.min.js" />
</head>
<body ng-app>
<input type="text">
Hello {{2}}
</body>
</html>
I don't know, what wrong am I doing ? Please help me out. Moreover, any more things that I should keep in mind, while developing angularjs code to avoid silly errors, then let me know.
You didn't close your script tag
Try like this
<script src="../angular-1.3.16/angular.min.js" ></script>
Demo
You need to close the script tag. Make sure you are using a valid version with valid path
<script src="../angular-1.3.16/angular.min.js" ></script>
Demo
Use ng-init like as
close the tag as below
<script src="../angular-1.3.16/angular.min.js" ></script>
This good for writing script
<body ng-app ng-init="firstName='Hello2'">
<input type="text">
{{ firstName }}
</body>
DEMO
Add App name in ng-app and close the script tag.
e.g.
<script src="../angular-1.3.16/angular.min.js"> </scrpt>
<body ng-app="myApp">
I'm currently trying to place this lightbox into this accordion
I've had them both working seperately okay, but I don't seem to be able to get them to work on the same page (whether or not one is inside the other)
I've noticed that I've ended up with:
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/lightbox-2.6.min.js"></script>
In my header, which might be one duplicating a more recent version of the other etc and was wondering if that could be a problem?
In the html I have:
<div id="accordion" style="width:1000px; border: 1px solid black">
<h4> Section 1 </h4>
<div>
<p> Text </p>
<img src="images/image.jpg"/>
</div>
</div>
Is there something I'm trying to do incorrectly, or is this something that just won't work in this way?
Thanks in advance for any help!
As I thought above, I had used the two different versions of JQuery and loading them both was causing a little bit of confusion.
To solve this I removed one of the JQuery sources:
<script src="js/jquery-1.9.1.js"></script>
<script src="js/jquery-ui-1.10.3.js"></script>
<script src="js/lightbox-2.6.min.js"></script>
(I have also changed the sources to be local, rather than referencing a website)
Though I didn't remove the oldest, this appeared to work better for the versions of things I was trying to load. Hope this helps someone else at some point too.
I'm using Prettify.JS to display some code on a Web site I'm developing. I seem to be having some problems with script tags, especially 'non-linking' ones:
<pre>
// Link CSS
<link rel="stylesheet" href="device.css" />
// Link JQuery
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
// Link DeviceJS
<script type="text/javascript" src="device.min.js"></script>
// Initialize DeviceJS
<script>
$(document).ready(function () {
$('selector').devicejs(options);
});
</script>
</pre>
This code displays the following (notice the entire script tag is red):
However, when I do this little hack below (adding some invisible html before closing the opening script tag):
<pre>
// Link CSS
<link rel="stylesheet" href="device.css" />
// Link JQuery
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
// Link DeviceJS
<script type="text/javascript" src="device.min.js"></script>
// Initialize DeviceJS
<script<span style="display:none;"> t</span>>
$(document).ready(function () {
$('selector').devicejs(options);
});
</script>
</pre>
It seems to display Ok:
The problem is when I add multiple non-linked script tag blocks, The problem comes up again. So the following code:
<pre>
// Link CSS
<link rel="stylesheet" href="device.css" />
// Link JQuery
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
// Link DeviceJS
<script type="text/javascript" src="device.min.js"></script>
// Initialize DeviceJS
<script<span style="display:none;"> t</span>>
$(document).ready(function () {
$('selector').devicejs(options);
});
</script>
<script<span style="display:none;"> t</span>>
$(document).ready(function () {
$('selector').devicejs(options);
});
</script>
</pre>
Shows as:
I looked through the Prettify.JS Source Code and on line 1211 I see the following:
['lang-js', /^<script\b[^>]*>([\s\S]*?)(<\/script\b[^>]*>)/i],
which I believe is part of the lexer.
I'm not a Regex Ninja so I would appreciate any assistance on how I could tweak this so that Prettify.JS can accommodate non-linking script tags with no attributes.
Thanks in advance.
An HTML example shows this working fine, so I suspect your problem relates to prettify not recognizing the content as HTML and so using the wrong language handler. Without seeing how you're invoking prettify, it's hard to say.
I looked through the Prettify.JS Source Code and on line 1211 I see the following:
['lang-js', /^<script\b[^>]*>([\s\S]*?)(<\/script\b[^>]*>)/i],
which I believe is part of the lexer.
You are correct. This is saying that a script elements starts with
<script\b[^>]*>
or the text <script (case-insensitively due to /i at the end) followed by a word break and any number of non > characters followed by a >
Then
([\s\S]*?)
non-greedily matches the minimal number of characters necessary before the close tag. This is in capturing group 1 so this content will be recursively prettified using the type hint lang-js.
Finally
(<\/script\b[^>]*>)
works similarly to the open tag, but is a close tag. It should probably not be in a capturing group, but that shouldn't affect correctness.
<html>
<head>
<script type="text/javascript">
// jquery and javascript functions
</script>
</head>
<body>
<fancy-jquery-ajaxy-html-section>
</fancy-jquery-ajaxy-html-section>
<noscript>
sorry you came to the wrong place - this site is all jquery/ajaxy stuff.
</noscript>
</body>
</html>
I tried surrounding <fancy-jquery-ajaxy-html> with a <script type="text/javascript"></script> but then nothing from that section is displayed even for users with javascript enabled.
But what I want to do is hide that <fancy-jquery-ajax-html> section only if the user doesn't have javascript enabled.
It contains content that is useless to someone without javascript turned on, so it shouldn't be shown at all.
A user with javascript disabled should only see a message saying that the page can't be viewed without javascript.
Is there a way do that?
The easiest way is to hide the section with CSS (e.g. display:none), then show it through Javascript.
EDIT: just a little example
<div>Everyone sees this div</div>
<div id="mydiv" class="hidden">You see this div only with JS enabled</div>
<script type="text/javascript">
$("#mydiv").removeClass("hidden");
</script>
<noscript>
<div>You will see this div only with JS disabled</div>
</noscript>
And, of course, in your CSS:
.hidden
{
display: none;
}
You could hide your fancy section using css:
<div id="fancy_jquery_ajax" style="display: none;">
</div>
then you could use use JavaScript to display the element:
$("#fancy_jquery_ajax").css("display", "block");
I hope that's right, I actually don't use jQuery that much. :S
Another approach would be to generate that HTML using JavaScript, so it can't appear unless JavaScript is running.
What I did is to have my javascript hide the nojsdiv and show maindiv. This way, if you don't have javascript the message shows up.
<body onload="allowlogin()">
<div id="maindiv" style="visibility: hidden;">
...
</div>
<div id="nojsdiv">
The training system requires javascript to be enabled.
</div>
</body>
I prefer to add a class of .js to html tags as soon as jQuery has loaded. This allows my to write css rules that apply only when the user has javascript enabled/disabled. This keeps your show and hide code out of our JS and lets CSS do its job and style the page
Here's how I would approach your problem:
<html>
<head>
<style type="text/css">
.js #fancy_jquery_ajax {display: none;}
</style>
<script type="text/javascript" src="/scripts/jquery.js"></script>
<script type="text/javascript">
$('html').addClass('js');
$(document).ready(function() {
// Stuff to do as soon as the DOM is ready
});
</script>
</head>
<body>
<div id = "fancy_jquery_ajax"></div>
<noscript><!-- stuff to say if use had javascript disabled --></noscript>
</body>
</html>
It's important to note that we want to add the class of .js as soon as jQuery has loaded and not add it in our document.ready handler. Otherwise we'd be back to square one.