Jquery in header not working :( - javascript

I have the following code in my header -
<script type="text/javascript">
if ($("#comments").hasClass("comments-list")) {
javascript:document.getElementById('g-aside').style.width='0px';
javascript:document.getElementById('g-aside').style.marginleft='100%';
javascript:document.getElementById('g-aside').style.visibility='hidden';
javascript:document.getElementById('g-main').style.width='100%';
}
</script>
It does not work for some reason... The following page is the one i am attempting to adjust.
http://luogocomune.net/LC/index.php/20-varie/4290-benvenuti-sul-nuovo-sito

First of all, include the jQuery library before this script block of yours.
Then, change your script block to:
<script type="text/javascript">
$(document).ready(function(){
if ($("#comments").hasClass("comments-list")) {
$('#g-aside').css('width','0px')
.css('margin-left','100%')
.css('visibility','hidden');
$('#g-main').css('width','100%');
}
});
</script>
Readup: http://api.jquery.com/css/

Related

jQuery not running locally

I have the following links declared inside the head tag:
<script type="text/javascript" src="javascript/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="javascript/scripts.js"></script>
And the following code inside the scripts file:
$("#person").hover(function() {
// trigger the mouseover event
$("#person-text span").addClass("important-info");
}, function() {
// trigger the mouseout event
$("#person-text span").removeClass("important-info");
});
$(document).ready(function(){
console.log( "ready!" );
});
I have also tried adding the jQuery library through Google and Microsoft CDNs, but it didn't work as well.
Here is a screenshot from the console errors:
I had a similar problem few days back. I moved the custom script tag at the end of the HTML page and the code worked. It generally happens for the $(document).ready() function.
<script type="text/javascript" src="javascript/scripts.js"></script>
Move the above line to the end of your Html page and that should work.
try using $(document).ready(function(){/*your code*/}) and try to change if your browser console showing 404 error for jQuery file
<script type="text/javascript" src="javascript/jquery-3.1.0.min.js"></script>
to
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.min.js
"></script>

How To add Javascript In header of Prestashop

I am trying to adding custom script in the main header of the prestashop but it is not working. may be i am doing wrong
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript" data-keepinline="true">
jQuery(".category_drop_menu").click(function () {
alert("asdas");
});
</script>
Please help me how i can add my custom script in prestashop header.tpl
Not sure what the problem is. I changed it a little but I think your example should work.
$(document).ready(function() {
$(".category_drop_menu").click(function() {
alert("Works");
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<button class="category_drop_menu">Click</button>

How to load php code into html tag DIV using Jquery?

I am trying to load php code into div tag to show the results but the below code doesn't work for.
Can anyone please help me...to resolve this
my code is below:
<html>
<head>
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
$("document").ready(function()
{
$("#myDiv").load("refreshing.php");
}
</script>
</head>
<body>
<div id='myDiv'> </div>
</body>
</html>
Change script tag to this
<script type="text/javascript">
$(document).ready(function()
{
$("#myDiv").load("refreshing.php");
});
</script>
i.e. you're missing ); at the end
Also, document should not have quotes on it
You cannot load php code .load() because as the web server gets the GET request with .php, the request is passed to PHP interpreter which will execute the PHP script and return the result of the php script instead of code. So what you can do is in your PHP script, do a echo of all the code that you want to display. Or, you can define custom rule in your Apache configuration.
You've forgotten the closing bracket:
$("document").ready(function(){
$("#myDiv").load("refreshing.php");
});

$('body').layout is not a function

I'm using the jQuery UI Layout plugin and I keep getting this error in Firebug: $('body').layout is not a function. I also get the same error in IE8 and below.
Obviously, it's being caused by the line where I initiate the layout UI in my scripts file:
$('body').layout({ *options here* });
Is there a way to prevent this error from showing? I'm pretty sure I need the BODY selector for this particular plugin to run.
** SOLUTION **
As the helpful answers say below, I had this line: $('body').layout({ *options here* }); BEFORE I included my jQuery and jQuery UI Layout Plugin files. Once I put the body.layout after those two inclusions, the error went away.
You seem to either
1) have not included the plugin properly (script tag missing/typo in the url, included it before loading jquery itself, whatever else could go wrong)
 or
2) calling $("body").layout too early - wrap it with $(document).ready(function() { });
it should be
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.layout.js"></script>
...
<script type="text/javascript">
$(document).ready(function() {
$("body").layout() // will work now
});
</script>
Make sure you're including the lines:
<SCRIPT type="text/javascript" src="/path/to/jquery-latest.js"></SCRIPT>
<SCRIPT type="text/javascript" src="/path/to/jquery.layout-latest.js"></SCRIPT>
Prior to the code you placed in your question. Otherwise, layout will have been undefined before use.

Timeago Jquery plugin not working

Jquery:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/timeago.js" ></script>
$(document).ready(function(){
jQuery("abbr.timeago").timeago();
});
html:
<abbr class="timeago" title="2008-07-17T09:24:17Z">July 17, 2008</abbr>
function Refresh() {
setTimeout(function(){
<?php echo 'var id = '.json_encode($_GET['id']).';'; ?>
$('#cmdz').load('cmdajax.php?id='+id);
},1000);
}
The #cmdz div contains the abbr tag. timeago working properly in onload but when the div is refreshed it won't works.
for some reason jQuery("abbr.timeago").timeago(); function not working. Here you can find full code:after ajax call jquery function not working properly
Try out Livestamp.js. It's unobtrusive and auto-updating. All you need to provide is the Unix timestamp.
Working demo http://jsfiddle.net/FFeE3/1/
Can you please try sourcing your time ago.js from below link and any particular reason you are using jQuery("abbr.timeago").timeago(); you can use $("abbr.timeago").timeago();
Hope this helps rest demo should give you more idea. cheers
Script
<script type='text/javascript' src="https://github.com/petersendidit/jquery-timeago/raw/master/jquery.timeago.js"></script>
code
$("abbr.timeago").timeago();​
Two way of representation, Do this way or other way but don't mix:-
jQuery(document).ready(function() {
jQuery("abbr.timeago").timeago();
});
OR
$(document).ready(function() {
$("abbr.timeago").timeago();
});

Categories