JavaScript not working on Chrome or on Firefox - javascript

Hi~I'm working on my personal website.
I want to realize an "image slide show" effect with a java script that i downloaded.
It works well on IE, but it doesn't work on Chrome or Firefox.
PS: the original downloaded file works well on Chrome, but after i placing it to my site, the problem comes.
here is my site: http://iphrog.244213.dprktimes.com/
here is the java script sample code: http://iphrog.244213.dprktimes.com/index2.html
they use the same js file, but the js file doesn't work on chrome for my site.
Whats the problem?

The problem is your div with the id of content has a z-index of -1000. This is causing it to not detect any of the clicks on your elements, as it is 'behind everything'. Remove this style, set it to 0 or set it to a non-negative number, and your script works fine.

Related

CKeditor - Images not showing in website frontend

While using ckeditor to add an image, the image is displayed and it works fine.
But when this code is saved in my database and then later reload the website frontend, the images don't show up anymore, although if you look at the source the 'img' tags are still there.
Tested in FF, Chrome, Safari and IE. No images.
Any idea how I can fix this?

Chrome PDF viewer malfunctioning when extension in started

I have a chrome extension which allows to write on screen in chrome tabs. The default behaviour looks like :
It works be simply inserting a canvas tag in the DOM and doing all the stuff in it. It works well in all sites. However, chrome PDF viewer behaves strangely when I use it :
Before -
After -
I don't think there is any issue with the extension because it works on all other sites. I think there is an issue with chrome PDF viewer itself.
I can attach the code here if asked in comments.
Ok, so I tried to replace all innerHTML += <value>; by insertAdjacentHTML("afterbegin",<value>); And now it's working fine.
It's because your canvas must be on top to ensure it will works on every website.
The z-index propery is not enough for that.
Hope that helped !

jQuery LayerSlider: LayerSlider not working with single image in IE 10

I am using LayerSlider (http://kreaturamedia.com/layerslider-jquery-full-width-slider/) which is working fine on all browsers except IE 10. Even the demo link is working fine on the browser but when I integrate the slider in the website I am working on, it fails to load the image and the following error is shown in the console:
"It seems like the URL of the image or background image "image name" is pointing to a wrong location and it cannot be loaded. Please check the URLs of all your images used in the slider."
The link of the image is correct and the issue appears if only one image is added. If more than one image is added, then the above error does not show.
I have checked for compatibility issues with other plugins by disabling other jQuery plugins but still no effect. I even tried to use the same version of jQuery the demo is using but still no luck.
If anyone has an idea what the problem is, kindly help me out
Thanks

Mobile collapse bootstrap not working in Chrome

I'm fairly competent with HTML and am working with Bootstrap for the first time, but I can't seem to get the mobile collapsible menu working on Chrome on the desktop (and presumably some other browsers).
Safari on iOS 7 with default mobile responsiveness shows the menu fine when clicked, but nothing happens when you click it in Chrome on the PC when the browser is resized to a mobile-like width.
Sorry if it has been said before - just went through the code and couldn't really understand why it wasn't working! :(
First time on SO and can't figure out how to put my HTML in here, so here it is.
Thanks peeps :)
You have linked jQuery from Google CDN and hosting your website from Dropbox. Dropbox does not allow external linking of script and font files.
So you are getting an error on your page:
Host the jQuery file on your website and link (internal linking). Like for example put jQuery in JS folder and link:
<script src="js/jquery.min.js"></script>
Problem will be gone. Hope this helps!

Everything showed good, except the tabs. (HTML,CSS,JS)

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.

Categories

Resources