I'm trying to build a jQuery-based next/previous navigation but ran into a roadblock of a weird error. Here's a very much simplified version of what I'm trying to do:
$('.next').click(function(ev) {
ev.preventDefault();
$('main').fadeOut();
$('main').load('/page/2/ main .content', function() {
$('main').fadeIn();
});
});
The next page link is usually generated dynamically of course.
Clicking on the link gives a 404 error in the Chrome developer tools and the content never loads into the main tag. Changing it to a rewrite-less /?paged=2 also 404's. When inserting a link to a page however (like /contact/) works without without a problem. Directly entering the link works as well, so rewriting is working correctly.
This is driving me nuts. Anyone has an idea how to make this work?
Related
For some time I'm trying to develop my own app using cordova. The first page I created is the login. When the user clicks on the submit button I check the credentials by sending them using ajax. Meanwhile I want to display a loading animation,and I found how to do it:
$.mobile.loading('show')
It works..almost. It only shows a black circle on the middle of the screen. I checked the console only to find :
Failed to load resource
ajax-loader.gif (0,0)
I ran multiple test: I commented the security policy,copied the image in different folders,checked the spelling and finally created my own span with url(images/ajax-loader.gif) and ..it worked. Then I did the same thing with the original loader(I found its span in the DOM explorer) and added an inline style url(images/ajax-loader.gif)..it worked!
Finally I realised this:
It is like it tries to load the same image from two different sources. How can I fix it?
Other details:Jquery 2.0.0/Jquery-mobile 1.4.5
This is some weird behaviour still not explained-so ANYONE can post the correct reason/explanation for this- but I will post the fix.
I took a look at this post and thought to give it a try.
This is how the css looks like(I edited it in debug mode so it should be overridden) :background: url(.././images/ajax-loader.gif)
Now it works but the question IS still active.
I have been having some issues getting jQuery to work on some parts of my website. To test if the jQuery would fire I prepared a bit of jQuery that launches everytime my header file is included.
When I am at the home page the jQuery fires properly and the pop-up comes up. As soon as I move to a different section of the site. The same jQuery code included in the header isn't firing. I have checked the console for errors or faults and couldn't find anything.
A test location of the website would be at this location
That is the homepage of the site, if you visit it a pop-up will appear. If you browse to this link the jQuery doesn't fire even though it's still there in the code.
The jQuery code I'm trying to launch is as follows
<script type="text/javascript">
$(function(){
$('#overlay').fadeIn(200,function(){
$('#box2').fadeIn(400)
});
return false;
});
</script>
I'm not very experienced in debugging jQuery and have tried consulting some other questions and forums thought these solutions or attempts didn't seem to work for me. I was hoping I could get a hint in the right direction here.
Your code
$(document).ready(function() {
$('#slider2').s3Slider({
timeOut: 4000
});
});
appears to be raising an error which causes the javascript processing to stop. The element '#slider2' element does not exist on this page. Either remove this code or add a guard condition such as,
$(document).ready(function() {
if ($('#slider2').length) {
$('#slider2').s3Slider({
timeOut: 4000
});
}
});
I'm using a fancybox demo (http://fancyapps.com/fancybox/) on my personal site. Everything works perfectly when I'm testing locally, but once I uploaded the site to be live, the fancybox feature is not working and instead brings you to a new page view the image.
This is the site I am referring to: http://colettemolleur.com/. Click on the image to see the issue I'm having. Also, I'm not forgetting to upload any of the js files, so I don't know why this is happening.
Any thoughts?
Thanks!
Colette
Check your path for Bootstrap, main.js and query.mousewheel-3.0.6.pack.js which return 404 not found on your page. I suspect the path are incorrectly setted.
In chrome, use the developer tools (using F12 or right click+ inspect element) to check for error on the page. I get 4 when opening your page.
I have a very complex site with 11 js files included on each page.
I have recently added the google +1 button, with the following code:
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone></g:plusone>
This displays the +1 button correctly until I click on it. When I click it, I get this error: https://support.google.com/plus/bin/answer.py?hl=en&p=plusone_button_error&answer=1199142
I have gone through the suggestions, and none are relevant in this case. I created a test page with only the above code in it and uploaded it to the same server. The test page works perfectly.
I'm assuming there is a js code conflict somewhere but I don't know how to debug it. Chrome and IE don't throw up any errors.
I got the same error here. I found that the page is taking too long to load and because of that the button could not work.
I commented some piece of code and page loaded faster than before and the button worked.
Iam working on a website and I dont have any clue why the tabs doesnt work when I upload the website. Because when I view the website normal it does work perfectly.
By the way: The tabs are working with a jquery script.
This is the website URL: http://bmvisuals.poshh.nl/
Greetings.
Edit: I mean some of the tabs doesnt appear.
Your About me tab does not show up because your server is case sensitive.
Aboutme.jpg != Aboutme.JPG
You should check out CSS Sprites. There is a flicker when you hover over a tab (the first time) because the browser has to load the hover image. With CSS Sprites an image map is used and all the images are loaded at once so the hover is seamless.
As an aside, your site does not scroll vertically. When my window is smaller than your site, the bottom gets cut off and there is no way for me to see it.
Firstly, nice site. Secondly your tabs are totally borked for me. I am using Linux Ubuntu and Firefox 3. Not sure about the fix though. Just thought I would mention it.
Using Firebug, I see some resources give a 404 error:
http://bmvisuals.poshh.nl/Scripts/Lightbox/images/lightbox-ico-loading.gif
http://bmvisuals.poshh.nl/Scripts/Images/PhotoGallery/PhotoGalleryContainerBackground.png
http://bmvisuals.poshh.nl/Images/Tabs/Aboutme.jpg
http://bmvisuals.poshh.nl/Images/Tabs/HomeActive.png
On a side note, the page doesn't work if javascript is disabled. I would suggest using the noscript tag to show a message saying javascript is required. The other option is to make the page work without javascript.