I'm new on the forum and also using JQuery, came to this Framework thru ZendFramework.... My problème is that i've done an animation that works fine on all browsers (Firefox, Opera, Chrome, Safari) but not on any IE ?
[Code]....
I'm brand new to jQuery, so I apologize if this is a 101 question, but I'm trying to sort out a production issue. I do QA for an ecommerce website. When one of our developers made some changes to our application recently, a couple of the plugins we use stopped working on those pages. Looking at the code, it seems we load jQuery 1.4 and several plugins, including autocomplete and popdown. In the changes, for some reason, the developer loads jQuery 1.4.2 (after 1.4 has been called) but doesn't call the plugins again. I'm assuming that this is the reason the plugins stop working. Can anyone confirm this theory?
(The reasons why we don't call 1.4.2 earlier in the document are, sadly, mostly bureaucratic. If I can get this confirmation, hopefully I can push through that.)
Nice for a change: a piece of code that does work in all versions of IE, but not in Firefox. I'm stuck.
<img alt="Loodgieters" title="Loodgieters" src="/core/loodgieters_uit.png" name="loodgieters"
border="0" style="margin-right:1px; margin-top:1px; float:left; cursor:pointer;"
onclick="document.location='/pages/loodgieters.php';"
onmouseover="foto1.style.backgroundColor='#392d63'; loodgieters.src='/core/loodgieters_aan.png'"
onmouseout ="foto1.style.backgroundColor='#008ac9'; loodgieters.src='/core/loodgieters_uit.png'" />
Explanation: element "loodgieters" is a menu button that should change on mouseover. It doesn't in FF, it does in IE. Secondly, when you "mousover" the image, it should change the backgroundcolor of a second element (foto1). Element 'foto1' is a table cell. In return, when you mouse-over this table cell, the image element 'loodgieters' should change as well. So it's a two-way thing.
The code for the table cell is:
<td height="189" id="foto1" bgcolor="#008ac9" valign="top"
onmouseover="style.backgroundColor='#392d63'; loodgieters.src='/core/loodgieters_aan.png';"
onmouseout="style.backgroundColor='#008ac9'; loodgieters.src='/core/loodgieters_uit.png';"
style="cursor:pointer;"
onclick="document.location='/pages/loodgieters.php';">
<img alt="Loodgieters" title="Loodgieters" src="/core/loodgieters.png"
style="border:0; margin-left:auto; margin-right:auto; margin-top:10px; display: block;" /></td>
It all works as I expected in IE, Safari and Chrome, but it does not in Firefox. The whole page validates as XHTML 1.0 Transitional. What am I overlooking here?
I have a big problem, here is the sample of code:
<ul>
<li>
<a href="#"> <img src="#" /> </a>
<div class="info">
[Code]....
So, normaly the div.info element is with css: display:none; And there is displaying only "a" element. But i have a little code of jquery who makes the div.info element showup when the mouse over on the "li" element. And code is working as i expecting, but not in the IE.
var pic = $('ul li');
pic.hover(function(){
$('div.info', this).stop().animate({opacity:'0'}, 600, function(){
[Code]...
This sure has me puzzled since it's usually the other way around. The script below, straight from a book, works in IE, but not in FF, Chrome, or Safari. Can anyone tell me what I'm not doing that would work in the Good browsers
[Code]...
[url]
If you click the link in FF you will see that when you press "PLAY" the arrow image animates from the top like it is supposed to... but does not show up in IE.
This could be a jQuery or CSS issue...
JQ:
HTML:
CSS:
I am having trouble with a script in IE7. The way the animation is meant to work is you click on a colour chip and it enlarges (click again and it reduces). In IE7 it works fine for the first one you click and then you can't click any of the others.
[Code]...
When I click the background image, f1 gets called and executes as expected, but f2 doesn't get called after the animation in f1.
Drupal.behaviors.director = function(context) {
$("#background").mousemove(function(ev) {
var x = ev.pageX;
var y = ev.pageY;
[Code]....
I'm using Fancy Form Slider and love it. In firefox, it's working great. In Safari, its not so hot. Check it out:[URL].. It renders fine in both, but the animation is acting REALLY weird in safari.
I've used alerts to see if its using the correct data, and it is. Both the "current" and the new marginLeft are properly being set (in fact, it IS being set in safari, because when i inspect the element, it has the right margin-left data thats being alerted. There's no errors being thrown into the error console, either.
[Code]...
I have some basic functions to animate something, but they only seem to work in FF, Safari, Opera... but of course not in IE 6.0. I don't know what I'm doing wrong, yet. Tried adding the DTD doctype etc... nothing changes.
Demo right here
<html><head> <title>test</title>
<script
type="text/javascript"
src="js/jquery-1.4.2.min.js"
></script
>
<script
type="text/javascript"
src="js/jquery-ui-1.8.2.min.js"
></script
> .....
I try to integrate easing with 1.3.2 animate but seems its just not working. Which version of the easing plugin I should use?
View 2 Replies View RelatedAfter appending an li by append() function , there is some animations through animate function. But in IE9 , it is not working as expected.
below is my code :
$magicLine.stop().animate({
left: $magicLine.data("origLeft"),
width: $magicLine.data("origWidth")
});
I am using Jquery 1.2.6 version with existing website. I want to animate something on mouse over and for it I used animate function for it but I not able to get expected result.
$(document).ready(function() {
$(".small-packagebuilder").css({"background-position": "5px 0"});
$(".builder_top_magenta span a").hover(function() {
[Code].....
I want to hide a map until it's needed, then when a button is clicked, load the map then scroll to it.Here's my experimentHere's what I'm using:
<div id="themap" class="themap c2">
<br />
<script type="text/javascript">
[code]....
I want to use animate function(changing the top value of UI tag)for the ui tags with a speed of 6000.Well the top value does change for the UI tag but it the animation is not visible meaning that it moves very fast.Instead it waits for 6000 ms and then at the 6th sec it suddenly changes the top value without giving the animation effect. This problem i m having only for UI tag below is the code
$('#van-one li a').mouseover(
function()
{
$('#van-one li ul').animate({top:"25px"},6000,"linear");
}
);
I have an image that I'd like to animate to the top right of its containing div (which has position relative).I've used this:
$(".trigger").click(function(){
$("#image").css({'position' : 'absolute'}).animate({
"top": "10px"
[code]....
I've created the following rollover effect but it doesn't work as expected :
$(document).ready(function(){
$('#area-row-2-sub-left a').bind({
mouseover: function() {
var tHeight = $(this).height();
[code]....
animate({height: tHeight} correctly sets the initial height but with a duration equal to zero. Seconf problem : a second mouseover on the element won't show the animation at all.
I cant get the scrollbar to animate to 500px, onload.
Here is a link to my page...[url]
<script type="text/javascript">
I have a toggle animation which puts the area I want to show to the user in view, ones that animation has played I want to animate several other objects on the page. I have the code to animate one object by using the callback function in animate. But is it possible to animate several objects in the callback function?. this is the code I have so far
$(document).ready(function(){
$(".navigaat").toggle(function(){
$(".mover").animate({left: '0px' }, 'slow',"", function() { $(".blok").animate( { fontSize:"160px" } , 1000 )});
[code]....
I am running what is called "XpressEngine" on my website. It is a Korean CMS tool that is like Joomla and it loads jquery 1.3.2 as standard on its boards and etc.
I have developed a new design website with jquery 1.4.2 and it works fine with by it self.. but it does not when it loads a board running by XE. I guess the reason is that the websites loads two jquery. So I tried to load the jquery 1.3.2 only so that it can run both my board and the website layout, but layout is not working with jquery 1.3.2. (except, if I only import jquery 1.3.2, then the board works fine but not the layout.) I guess my code is some what requiring jquery 1.4.2.. but I am not sure why yet..
My question is, is there any way to import jquery 1.4.2 and 1.3.2 simultaneously? (I personally think its not possible though..
[Code]...
Below is the head section of the page. It works in everything but IE?
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery-1.1.3.1.min.js"></script>
<script type="text/javascript" src="jquery.easing.min.js"></script>
[Code].....
I use the wonderful .animate() method to create a "parallax website". It's still in developpement, but you can see the result : www.ohnewgarden.fr My problem : When you are at the very right, the animate effect reset my left property before animating. Which is weird is that this "reset" is applied only to two layers, without any sense. I'm going crazy !
So if someone could help me, it will be very nice ! It's probably my code which is wrong, but I can't see the mistake.
[Code]...
I said for my defense, I have tried to remove .stop(), tried to change parameters of .stop(), tried to reset (like there) the left property with a .css() method, and I have also tried to animate with "+=" (like there), but nothing works. If you follow to the link I gave, you could see very easily by clicking on "Contact" and after animation by clicking on "Accueil".
Is it possible to handle conflicts between 2 versions of jQuery loaded in the same page? Assume that two applications (from different developers that know nothing of each other) share the same canvas (page) and each one of the developers is allowed to register global JavasScript libraries on the page. If each developers registers a different version of Jquery how could the hosting page handle conflicts?
View 5 Replies View RelatedI need to use some features in later versions of jQuery (specifically, hoverIntent in v1.5), but my current sites are running 1.4, and in some cases 1.2.
View 4 Replies View RelatedI have a problem with attr() function.I made my own lightbox and with jQuery 1.4.x it works nice. But now I use 1.7 and there is a problem. When I called attr in 1.4 $(element).attr("rel") when element hasn't rel, it returns empty string, but in 1.7 it returns undefined.Why? I read a changelog and I didn't find any change at that function.
View 2 Replies View RelatedI have a site which uses a version of jQuery that might be an older version and when I try to add the code for PrettyPhoto which uses jQuery version 1.4.2 the site breaks. The earlier version of jQuery is used to implement the accordion effect and the background resizing effect.
Can someone peek at the multiple versions of jQuery in my code and tell me more about what is going on and how I can fix it?
Here is a link to the site in question: [url]