I am having a problem with JQuery powered animations in the lower part, they are sort of blacked out, see the site and you will understand [URL] How can I fix it? Works fine on Chrome and Firefox
View 4 RepliesI can obviously load an aspx page into a div container thru .load jquery function. But, if the aspx page is already enginereed to work with aspnet ajax (scriptmanager,etc) , this is lost and the first postback cause all the page to reload. My question is, how can I import an aspx page into a div, maintaining its own ajax functions ? In case it's not possible, what's the best way to get same result?
View 2 Replies View RelatedItried the following code and it seemed like fadeIn() didn't work when the image has trasparency defined for it. i tested with IE8. Is this intended?
<html>
<head>
<style>
[code]....
I'm trying to make a jquery powered login and register element within a webpage. The page won't read the value of the forms I want it to read. The page is here[URL].. u1241436/Messages/(login or register forms). I use the following code:
[Code]...
I've running in problem of getting png trans. to work with IE6 SP2 patch. Here a discussion on it. I'm wondering if anyone has update or any news on this issue?
View 2 Replies View RelatedI've got a PNG set as a background image in my CSS and of course it doesn't look too hot in IE. I know there's a fix for pngs in IE but can't see anything to address the issue of background images in CSS that are pngs.
View 9 Replies View RelatedI have been working on a Javascript powered search engine for a set of browser based user guides. I can't use any server-side languages as it will all be accessed from a network drive, which as been a real pain as I would rather have just made a php search engine, but whatever...
I have a working JavaScript search function, currently the results are displayed in the same window/frame as the search form.
All i need is to be able to target the results to a different frame. For example, I'll keep the search form in a top frame, and some information in the bottom frame. Submitting the search form will display the results in the bottom frame. Its giving me a headache, I'm sure it is remarkably simple. Code:
I can't seem to get the PNG background fix for IE6 to work for Nivo Slider. I'm using IE PNG Fix - TwinHelix and I've got iepngfix.htc and blank.gif in my CSS folder. iepngfix.htc points to blank.gif like this: IEPNGFix.blankImg = thisFolder + 'blank.gif';. In my nivo-slider.css I've got
[Code]...
check out the Social Media "more" button dropdown at:[URL]
It's supposed to grown in size, and then fade the icons up.
In IE, it grows but then does nothing.
The jQuery code:
<script type="text/javascript">
jQuery( function(){
$grown = 0;
jQuery("#more-social").click(function() {
[Code]....
I'm working on implementing a menu and need to have information when the menu size is larger than the width of the window. The problem is that pas a certain point, jQuery("body").width() keeps registering 497, despite being much smaller than that. Has anyone had this issue
View 2 Replies View RelatedWhat's the best use of fadeIn particularly the stop() Function?Here is my code:
$('.hireMe').mouseover(function(){
$(this).stop().animate(
{backgroundPosition:"(0 -25px)"},
{duration:200});
[code]....
And what this is doing is when a mouse is put over my div 'hireMe', the background position is animated upwards and in fades in my text with an id of 'resume'. However if halfway though the FadeIn you move the mouse out of the container, it will permantly be stuck in this limbo world and will never return to 100% opacity again. Am I utilizing the stop() properly?
This is the website that is in question. Below is the script that I think is causing the problem. Every time you navigate to a new page I want the pages to fade out/in. However, there is a brief blink in between animations. I have tried to use stop() and not, but neither seems to help. I will post both options.
Option 1:
Option 2:
I want to animate a button with .hover and then animate it even more with .click. The problem is when the button is clicked, the mouse is no longer hovered so the hover returns to the default position. I need to stop the .hover from returning to the default non-hover state when the button is clicked.
Hover Code:
$('#about-btn').hover(function () {
$('#about-btn').stop().animate({
marginLeft : 27
[code]....
I taught it to myself without even having any true JavaScript experience and am sure that while functional, many of my implementations could/should be written completely differently. I'm running some animations that look great in everything except for IE. In IE I'm seeing a thin, ragged black border around some of the elements that I'm animating.
View 1 Replies View RelatedI have some code that executes two animations when the user clicks on an area. I want both animations to go off at the exact same time, however from time to time it seems as if one will be triggered first and then after a slight delay the second one will be triggered. This, of course, is noticeable and a problem. How can I ensure that they will go off together?
This is a watered down version of my code:
$('#container).click(function(){
$('#circle').animate({left:'500px'},1000);
$('#square').animate({left:'200px'},1000);
});
I have applied the fadeIn() and fadeOut() effects to a li>ul in my html, but if the user leaves the ul briefly then re-enters it before it has finished fading out, the ul fades back in again. This can happen many times over by accident and it's very annoying.
If the user leaves the ul I want it to fadeOut() and NOT fadeIn() again until the user re-enters the parent li element.Is there a way of ensuring this? I have done a quick search for while and if/then/else functions but haven't been getting anywhere. This is what I have, very simple indeed:
$(document).ready(function() {
$(".nav ul").hide();
$(".nav li.conductor").hover(function() {
[code]....
i have in place an fade in application of addclass to a selector but i would like the transition to use one of the easing plugin equations instead for more dynamism. I can't tell how i would do this, since all the examples only use the animate function.
View 1 Replies View RelatedIn pseudo code, here's what I'm trying to do with some text:
shrinkText.changeText.EnlargeText.
The jQuery I'm using for this:
$('span#calendarNumber').animate({
color: '#999',
fontSize: '12px'
}, 500 ).html($('#calculatorSampleInPopup1').val()).animate({
color: '#900',
fontSize: '40px'
}, 2500, 'easeOutElastic' );
What happens visually upon triggering this is this:
- HTML content changes
- text shrinks
- text enlarges
I think what is happening is that the first animation is suppose to span 500 (miliseconds?) but jQuery doesn't pause for that, it just starts the animating and goes immediate to the second event which is to change the text. In otherwords, I think it's triggering correctly, it's just not producing the visual effect I want. Is the solution to put a pause of some sort between the first two events? If so, what's the proper method?
I've downloaded the folowing plugin: [URL]
And it worked ! But now I want to now if I cand do more color animations on one element.
I have an example, when an <li> is hovered, it chages its background color, and at the same time, I want it to change the color (text color):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
[Code].....
I have a group of 4 divs and I'm looking to use jQuery to animate them once, then have a delay using delay(), and then run another set of animations on them, putting the divs back to their original configuration. Here's the code that I have:
//only selectors called 'option1' are affected by delay, and not 'option1 img' or 'option2'
$("#option1").showOption1().delay(3000).hideOption1();
//if i don't attach to #option1, delay doesn't work, but the animations that need to happen simultaneously work
[Code]....
will work from hideOption1() after the delay. The rest of hideOption1() is fired immediately after showOption1() finishes, ignoring the delay.
On the other hand, if I run line 5, all the code in hideOption1() runs simultaneously as desired, but ignores the delay entirely, running immediately after showOption1() finishes. How can I have all the code in hideOption1() run simultaneously after the delay?
So I have a navigation thats decently simple, but the JS doesnt seem to operate in the correct manner. When i hover over a child navigation list item, the parent will start its animation as well. I know when you hover over the child you are in turn hovering over the parent, but is there a way to get the parent to not animate? [URL]
View 1 Replies View RelatedI want create a page which has animation at the bottom of that page. I use jQuery to do that. This is the way I do it
<a href="#" class="animation">Animate this</a>
And this is the jquery
$(document).ready(function() {
$('a.animation').click(function(e) {
e.preventDefault();
//animation goes here;
});
});
When I run the code, all animation run very well except the page always scroll to the top. I try to change the href attribute to javascript:void(0); but it still run like that..
I want to use the Ajaxify-Plugin ( URL... ) for my new Website. It fits exactly my needs.Sadly the animations are not working correctly.When your Internet-connection is too fast, you don't see animations at all (on a local machine also). I putted up a demo: URL...The content is supposed to fade out, then the new content gets loaded and then this new content should fade in nicely again, like in my own example, which I got from a tutorial that is just using pure jQuery resources: URL... [code]
The author of the plugin himself is using a server delay to overcome the sideeffect ( URL... - click some links under "New v2 features"), but i think that's the wrong way to go for production.Sadly im not good enough in JavaScript-programming to tweak the plugin by myself, to get it to work like in the second example... I tried it now for 6 hours.I would really like to use Ajaxify, because it has all the features I need united in it. The only thing that is not working are this animations.
This is a weird one. I have a page I'm working on, and I made a simple div that slides up to display some content, then slides down, replaces the content and slides back up again. Basically a showy news ticker.
When I created the div/animation code it ran fine. smooth as silk. However, I then decided to move that part of the html into a templated system, where some php reads a second file and outputs the contents into the webpage. (real simple stuff, it uses file_get_contents and echo to output the file contents).
Using this system, it all displays correctly, but the animation is suddenly slow and jerky. This doesn't make sense to me. Why would the animation suddenly become jerky just because the html that creates the divs is now created via php? Surely the php fires long before jquery gets involved - so why would this occur?
I have an image that I want to animate several properties, starting at the same time but ending at different times.
I want opacity to go from 0 to 1 in 2 seconds, and dimensions to grow in 10 seconds. Both animations should start at the same time.
I'm calling animate twice, but the second animation waits for the first one to complete.
Is there a way to get around this without having to code my own animate function?
I have some elements that hide and show real quick when I click on the same selected checkbox. I only want to hide or show something on change, and only when I need to. The way the behavior works now is I have 20 checkboxes, and each time I check one (even if it's the same), I see the associated elements hiding, then showing real quick. I don't want anything to happen though if all they do is toggle the checkbox, unless there's a condition to uncheck it. It's kind of hard to convey what I'm talking about here, but maybe my code can shed some light:[code]
View 3 Replies View Related