JQuery :: Image Doesn't Work Properly In Safari And Chrome?
Nov 1, 2010I've hosted a test suite at: Webkit Bug Clicking on the enlarged image doesn't work properly in Safari and Chrome.
View 2 RepliesI've hosted a test suite at: Webkit Bug Clicking on the enlarged image doesn't work properly in Safari and Chrome.
View 2 RepliesWhen I load a page with jQuery load() function API. It does not load the style section on the header using Safari and Chrome.
Attachments
test.php.txt
Size : 538 Bytes
Download : 524
I want use $.ajax to read some infomation from xml file,here is my js code :
$
.
ajax
({
[Code].....
However, the code only work great in firefox and opera. It doesn't work in chrome(7.0.517.24 ) and safari(5.0.1),failed without any alert,not even the alert("ajax failed"). Is there any bug in $.ajax in chrome and safari?
I tried to apply jCarousel on Ajax loaded content. It works on Firefox/IE/Opera, but not on Safari/Google Chrome. Can somebody help me finding where the problem isP.S. On IE, when you close the Ajax content there will be a alert message shows 'Jcarousel: No width/height set for items. This will cause an infinite loop. Aborting ...', but it doesn't matter as the alert function can be shut off.
View 1 Replies View RelatedI'm working on a page that displays a query result upon loading, and has a DIV that (initially) is invisible and has 0px for height/width, plus a negative z-index. This DIV contains an iFrame that has a form in it for filtering the query. Upon clicking a link, javascript goes into action, giving the div height, width, visibility, and a high z-index so it "floats" above the main page (centered in the browser window.)
This is working flawlessly in FF, Safari, and Chrome. However, in IE7 and IE8, not only is the javascript engine slow and clunky, but once the DIV "appears" the form contained within is invisible (view source shows the code, it just isn't being parsed or displayed.) I'll include my code; can anyone think of a reason why it would show the DIV but not the form in IE7/8?
CSS
Code:
#inner_vi.hidden {
height:0px; width:0px; min-height:0px; min-width:0px; max-height:0px; max-width:0px;
display:none; visibility:hidden; background-color:#FFF; z-index:-11;
padding:0px; margin:0px; border:0px; position:absolute;
opacity:0.0; filter: alpha(opacity=0); top:0px; left:0px; zoom:1;
[Code]...
Before image upload I want users to preview their choice. For some reason JS doesn't work with all browsers except FF.When a user selects file, JS preview function should insert it into #addPreview div where preview.gif is located as a default picture. If everything goes OK preview.gif is replaced with new selected file. Otherwise wrong size or file type is detected. Alert message appears in #addPreviewAlert div.Here's my code:
HTML CODE
Code:
<!-- ALERTS -->
<div id="addPreviewAlert"></div>
<!-- END ALERTS -->[code]...
Tell me why Firefox works as desired, but all other browsers don't allow any preview. They don't show any JS error messages and alerts either.
Does anyone knows a method to measure the scrollbar's width, which works in Safari/Chrome.
The innerWidth function doesn't seem to take the scrollbar's width into account when measuring the innerWidth of the child element of a scrollbared element.
This is my code:
I've set the animation to large numbers (1000) to make it very obvious.
The helper will show before the other fieldSets have been hidden. The show animation begins about half way through the hide animation. Since both elements are occupying the same space, this makes the container jump around in size as it breifly expands to fit one under the other.
I'm setting position left to 100% and it works except in Chrome/safari. These browsers set it about 100px from the left not 100%obj.css('left', '100%');Setting the css by itself <img src="" style="left:100%;position:absolute" works fine.I don't know if this is a browser problem or a jquery problem.
View 1 Replies View RelatedI have two select lists that have option lists that are created from external XML lists that contain course offerings available at different locations. Each location has a different set of course offerings. When a user selects a location, the javascript code will hide / show the option entries that correspond to the course offerings for that location. If a user selects a course offering, the javascript code will show / hide the locations that offer those courses.
Click events are attached to each of the Option entries with the code below. The code works correctly with Firefox and Opera, but the click events are never triggered in IE, Safari or Chrome. The Chrome debugger seems to indicate that the click events get set up in Chrome (although I am not sure where JQuery saves event handler data). Each option entry has a unique ID tag.
$(".locn_option_select").click(function (locnevent) { // Set up click action on the option entries
locnevent.preventDefault;[code].......
It's an incremental search function.
$(function () {
$('#quickFilter').incrementalFilter({
items: 'dl.entryList > dt',[code].....
I'm trying to hide a few options in a dropdown box using .hide(). This works perfectly fine in firefox and chrome, but it doesn't work in IE and Safari. My original code is more complex but I've narrowed it down to this.I've tried several combinations and nothing has worked.hide() works, but not for things within option tags for some reason.[code]
View 1 Replies View RelatedI have a form that should be submitted via ajax; it works of ff and ie, but doesn't in safari 3.2.1.
I've simplified every page to isolate the problem:
The html:
View this message in context: [url] Sent from the jQuery General Discussion mailing list archive at [url].
my code is as follows:
<td><a href="#" id ="putsomeDynamicvalue">ingresar</a></td>
<script type ="text/javascript">
$(document).ready(function(){
[code]....
I send some data by post from page to PHP script. In FF it works fine, but Google Chrome fall down...
var category = 'category_name';
$.post('../ajax.php', { 'ajax': 1,
'active': 1,
'category': category,
'id': id}, function(out) {
alert ('echo');
});
I tried the same code without apostrophes, but with no effect.
[Code]...
I found error... In POST variables passed to ajax.php I had 'content': content and content is probably jQuery reserved word (and this variable wasn´t define before). But I don´t know why that works in FF.
I use a subnav and subsubnav with the following code. It works in all popular browsers as desired, except in Chrome (latest version), which don't open subnav-2I've tried several methods without success. The classes subnav-1 and subnav-2 are li elements. Maybe someone can tell me where is the problem.
[Code]...
the remove(i) doesn't remove the option[i] but works unexpectedly and removes the first 4 options.how to delete the selected index only?
View 1 Replies View RelatedI'm using my custom component that has a combo box (jsf's h:selectOneMenu, which has a onselect event)in it and it already has a onchange event, so I want the onchange event to trigger another onselect event with jQuery and it only works in Firefox.
I tried it without the component and it looks like this:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
[Code]....
and again works only in Firefox, and not IE and Chrome. It works with onblur event, but the onselect is closer to what I need.
Is it not working because the html <select> tag doesn't have a select event but Firefox can do it for some reason?
Been trying to add an image before the closing of the anchor tag:
<body>
<a href="http://www.test.com/">http://www.test.com/</a>
</body>
If I use:
$("a").append("<img src='testimage.png' /");
No image will appear in WebKit (Chrome, Safari, etc). Firefox and IE works fine.
First, We 've a course registeration Web app that was developed in .NET/javascript.
In brief, the students login, then the available courses is drawn to him (as DIVs) to select courses then apply registeration.
Of course , the dynamic part of selecting/highliting courses is done in javascript as a clientside Javascript.
The problem that this app was developed with no x-browser compatibility in mind (e.g firefox and chrome). it works fine on IE , ofcourse doesn't work properly on Mozilla browsers.
Now, i want to modify it to be mozilla compatible , i spent time inspecting it (functions and classes, "yes the developer made a javascript classes") .
Is there a tool or something that porting to mozilla ?
I am developing a site that requires the navigation menu to have one rounded corner at the end on the home button. The default button state is created using a background image but I need it to also have a rollover effect on hover and also on focus (for the home page item only). I have tried to use CSS and curvy corners Javascript code to create the effect as I don't want to use images. However, I don't think the curvy corners script is picking up the div item that I want to apply the corner to.
The trouble is I have a number of div boxes on the site that also have rounded corners (3 rounded and 1 square). The CSS is working fine for these in all browsers apart from Opera but when it comes to the navigation it doesn't work properly in IE. Here's the HTML for the menu:
Code:
<div id="menu">
<ul>
<li><a href="index.htm" class="home">Home</a></li><li><a href="#">Mortgages</a></li><li><a href="#">Life Assurance</a></li><li><a [code].....
The CSS is in an external stylesheet, although I have also added the CSS for the rounded corner items to the header code.The class 'homefocus' seems to work when applied to the a tag on the home page but the other class 'home' which should work on hover won't work in IE.
I have a simple problem that I can't solve. I am trying to code a "More Info" button/link to display some more technical details of an item, if required or wanted. I haven't tried incorporating any code in to my web site yet, first I am trying to test how it can be done in a seperate file.
What I have right now is a table with two cells. In one cell is static text, in the other is a hyperlink. The onClick event calls a JS function called "more_info()" in which a global varible is altered to contain the value 1.
Directly after these two cells is more JS (this is before the table ends). The JS here is checking to see whether the value of the global variable has been changed. If the value is 1, display information. There is no "else" clause because I don't want information displayed unless the variable is equal to 1, so it is not required.
I think I know what the problem might be. The browser is reading the code in question before I ever click the link and has already been executed before the variable is changed. I know JS is object oriented so it will not sit there waiting for me to click the button before reading the logical statements.
[Code]...
The very simple code (below) works fine in Safari (and Chrome, Firefox etc.), but it doesn't work in Mobile Safari. Why?(You can find a working example at: http:[url]....)
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>[code]......
The code below works fine on IE and FF but not on Google Chrome.
You can preview the below code by pasting it to Frontpage, Dreamweaver and etc.
I'm trying to do a redirect using the below code:
<script type="text/javascript">
window.location.href = "http://google.com"
</script>
FF and IE work as they should. Chrome doesn't.
The request above to http://google.com, gets a 'canceled' status in Chrome browser > Development tools > "Network".
I've tried several other functions:
location.href = url
location.replace(url)
document.location = url
location.assign(url)
window.open(url, '_self')
Same code pasted within a local html file works fine.
Below is the redirect request that it's canceled by chrome: [URL]
I have some simple code to have one div bounce around inside another. It works fine on Firefox and IE, but for some reason in Opera and Chrome it only moves left to right.
This suggests that Chrome and Opera allow you to dynamically set style.left but not style.top. This seems odd to me.
why this won't run as intended on Chrome or Opera?
Here's a very simplified version of my code to demonstrate the problem:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
[Code]....