Jquery :: Simple Fading Slideshow Hogging Cpu?

Mar 3, 2010

've got a fairly simple slideshow object which takes an array of images and rotates through them, with a fade between each picture. But it seems to use a fair amount of cpu, especially on IE, a little less so on firefox. Any ideas on how to optimise this? I'm concerned that the way the object refers to itself may not be the most efficient.

Code:
function picSlideShow(elementID, picArray)
{
var self=this;
this.id = elementID;
this.picArray = picArray;

[Code]...

View 4 Replies


ADVERTISEMENT

Script That Gives A Neat Effect On The Navigation And Want To Include A Simple Fading Slideshow On The Same Page?

Jan 11, 2011

I have a JQuery script that gives a neat effect on the navigation and want to include a simple fading slideshow on the same page.Any script I have tried for the slideshow either uses JQuery or Mootools and it conflicts with the navigation script.Can anyone recommend a smooth fading slideshow that wouldn't conflict or suggest how I can get around this. I read a bit about 'no conflict' but don't understand how to implement it.

View 3 Replies View Related

Jquery :: Simple Prototype Slideshow And A More Comprehensive Slideshow On Website?

Nov 25, 2009

I am using a simple prototype slideshow and a more comprehensive jquery slideshow on my website.When these are used on the same webpage on my website there appears to be a collision: (For example)Code:element.attachEvent is not a function[Break on this error] element.attachEvent("on" + actualEventName, responder); How can I avoid the conflict without reverting to a new slideshow?

View 1 Replies View Related

JQuery :: Fading Slideshow Flicker On Mouseover

Jul 31, 2010

I've adapted code from theslideSwitch.js tutorialby Jon Raasch, which is basically a fading slideshow. The script promotes the 'active' slide to a higher z-index and animates the opacity for a fading effect. It's working fine with a pause added to stop the slideshow temporarily on mouseover. The issue I'm having is I'm trying to stop the script from queuing up when repeatedly mousing over/off the slideshow. When this happens it flickers and goes berserk. I've experimented withstop(true,true)in various locationsbut haven't got it working properly. Where to insert this in the following code?

Code is below...
// slideshow function
function slideSwitch() {
var $active = $('#hp-featured div.active');
if ( $active.length == 0 ) $active = $('#hp-featured div:last');
var $next = $active.next().length ? $active.next()
: $('#hp-featured div:first');
$active.addClass('last-active');
$next.css({opacity: 0.0})
.addClass('active')
.animate({opacity: 1.0}, 1000, function() {
$active.removeClass('active last-active');
});};
var playSlideshow = setInterval( "slideSwitch()", 5000 );
// pauses the slideshow on mouseover, then plays again on mouseout
$(function() {
$('#hp-featured div').hover(function() {
clearInterval(playSlideshow);
}, function() {
playSlideshow = setInterval( "slideSwitch()", 5000 );
});});

View 1 Replies View Related

JQuery :: Fading Slideshow With Number And Previous Next?

Jul 17, 2010

I am a newbie in jquery and I really need to know this script. What I need is something like the tour header of [URL]... The one with fading slideshow and with number and next, previous arrow. I'm looking thru the net but I guess I'm not really pointing myself to the right way.

View 2 Replies View Related

Jquery :: Fading Text And Image In Slideshow At The Same Time

Mar 26, 2010

I am trying to have text that is placed over an image cross fade into another image with text placed over it. I am using jquery and the images are cross fading perfectly. The text isn't working so well and in Firefox it seems to be very choppy and even sometimes the text just disappears and then there is a blank slide without any text or the text is showing up on the wrong image. Here is the code I have so far:

HTML Code:
<div id="slides">
<div class="slide">
<img src="_images/placeholder3.jpg" width="695" height="195" alt="A Passion for Service" />
<div class="slideText">
<h1>And A Different Heading</h1>
<p>With the appropriate solution for each client, we provide biomedical engineering and information technology services to suit your needs.</p>
[Code]...

I am new to jquery and am going through the Sitepoint book "JQuery: Novice to Ninja. I am using the crossfade code from the book and I tried to apply it to the text as well.

View 2 Replies View Related

JQuery :: Simple Fading DIV Test Not Working - Anchor Tag Null?

Sep 8, 2009

I'm doing some simple tests and I can't get this to work on a wordpress site. Basically I'm trying to fadeOut a div with id of "box" when a link is clicked. I mentioned Wordpress because the head code is loaded dynamically into the page template, as well as the body content. I wasn't sure I this made a difference in diagnosing the problem. When I load the page, Firebug keeps giving an error...
$('a') is null

Here is my stripped html code...
<head>
<script src="[URL]"
type="text/javascript"></script>
<style type="text/css">
#box {background-color: red; width: 300px; height: 300px;}
</style>
<script type="text/javascript">
$(function() {
$('a').click(function() {
$('#box').fadeOut();
});
});
</script>
</head>
<body>
<div id="box">
</div>
<a href="#">Fade Out</a>
</body>

View 2 Replies View Related

Image Slideshow With Fading Images

Jan 21, 2010

Alrighty so here's what I have. Live example: [URL] It's a image slideshow that dynamically gets all the images (via php) in the current directory and puts them into the slideshow array. The array then randomly displays the images in the slideshow (via javascript). There are 5 images in the folder rotateimage which also has the php script getimages.php in it. Currently only the first image fades in however I want all the images to fade in as the first one does.

[Code]...

View 3 Replies View Related

JQuery :: Simple Slideshow For Home Page Promotional Graphics?

Dec 13, 2011

I'm trying to implement a simple 490x334 slideshow to rotate three to four images on our home page.

View 3 Replies View Related

Add Captions To Simple Slideshow?

Aug 2, 2010

I'd like to add captions to this this simple JavaScript slideshow. I have looked and looked and can't find one that doesn't use tables for the captions. I'd really like to stick to <divs> if possible.

Code JavaScript:
<script language="JavaScript">
var i = 0;
var path = new Array();

[Code]....

View 4 Replies View Related

Clickable Hyperlinks On Simple Slideshow?

Sep 2, 2007

I'm working on a site for a college javascript class, but I want to do a little bit more with my class site. I have a very simple slideshow set up( as a pop-up), but I want the images to be clickable and take the person to a site. Specifically, I have images for books on amazon, and I want the person to be able to click on the images and be taken to the specific page where the book is sold.

I'll post what I have, I was wondering what would be the best way to integrate it into my slideshow.

<body onblur="self.close()">
<div style="text-align: center;">
<p>If you like this site, you will love these<br />
wonderful books. Click <a href="http://www.amazon.com">here</a>

[Code].....

View 8 Replies View Related

Adding A 1px Border To Simple Gallery Slideshow

May 15, 2009

I see in the script for this slideshow a way to customize the nav panel.

My demonstration page

Code JavaScript:

However when I put the borderTop property after fontStyle nothing is showing. Is this correct way to style this.

View 1 Replies View Related

JQuery :: Create A Slideshow With Thumbnails The User Scroll Through And Use To Navigate The Slideshow?

Aug 18, 2010

So Im trying to create a slideshow with thumbnails the user can scroll through and use to navigate the slideshow. I'm a big fan of cycle so I wanted to use that as my main slideshow component and was planning on using jcarousel for the pager. So far it works great in Firefox, Chrome, and Safari, yet in IE the thumbnails are not loading. I'm guessing it has something to do with how the images in the pager are generated and then jcarousel just isnt proccessing that in IE but I 'm not sure. I feel like I'm very close to getting this slideshow to work, yet I need to figure out why it is failing in IE.

[Code]...

View 2 Replies View Related

JQuery :: Add Text Slideshow To Image Slideshow?

Jun 1, 2011

i have a small image slideshow i want add a text slideshow to image slideshow. how is it?

my code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>

[Code]....

View 7 Replies View Related

JQuery :: Fading In A Div?

Jul 29, 2010

I have a problem and I just cannot figure out what is wrong. I want to show news on a page and to fade them in. I am using jQuery AJAX to pull out the news from a MySQL database. Here is the code (I will explain what the exact problem is in the code):

[Code]...

View 4 Replies View Related

JQuery :: Fading In A (timed Out) Div?

Nov 16, 2010

I'm looking voor the right syntax to fade in a div. So far I only found syntaxes that deal with button actions but I just want to fade in the div after a few seconds. How do I set that up? Switch off visibility with css and then?

View 2 Replies View Related

JQuery :: Fading Things In And Out?

Dec 31, 2011

i have a problem with fading things in and out using jquery. Please check it out.THe problem is that sometimes the fading in happens before the fading out. What can be done to fix it?

[Code]...

View 12 Replies View Related

JQuery :: Fading Transition On IE8 And IE9

Mar 29, 2011

I'm using a template from templatemonster: [url]

This template is using gallerific with jquery, for some reason the fade of the template is not working on IE8 and IE9.

It is not problem of the original script as the fade works very well as you can see at: [url]

The code of jquery-1.3.2.js and jquery.galleriffic.js is exactly the same as I'm using the same files...

The only difference is that the template is using some custom code as follow:

View 1 Replies View Related

JQuery :: Backgroundimage Fading Effect - Possible Or Not

Jul 27, 2009

I would like to have an background-image fading effect, like a slideshow, but i dont know, if its possible or not... I thought that it would be possible: an array with the urls, a timer and the fading effect, but i dont know the most common way...

View 5 Replies View Related

JQuery :: Best Practice For Fading-in An Image ?

Apr 14, 2010

I have a photo blog [url] and want to create an effect that fades-in the displayed picture when the page is loaded.

An important requirement for me would be that the page also has to work without Javascript.

Currently I am using the following small plugin:

It is called directly beneath the <img> element:

This way it works fine with the current versions of Firefox and IE. I did not test other browsers or versions yet. I tried to call it in $(document).ready but then IE might display the picture shortly before it is hidden and faded-in.

Since I am not 100% happy with having the code in the middle of the HTML and with depending on the timing of execution to avoid flickering I wanted to ask for other solution or best practices to achieve what I would like to do.

One solution that came to my mind is to do create the image in JScript and only fade it in after it is loaded. To work without Javascript I could still put the <img> element where it was but within a <noscript> element. But not sure how well the <noscript> is supported by older or exotic browsers.

View 2 Replies View Related

JQuery :: Fading In Divs From Buttons?

Sep 7, 2009

I'm not sure if I'm going about this in the right way. What I'm doing doesn't seem to be working anyway.

I'm trying to fade in a couple of divs when a button is clicked a fade out the current divs.

[Code]...

View 3 Replies View Related

JQuery :: Fading In On Page Load

Jul 16, 2009

I have a div box on a page that had 6 images absolutely positioned in it. When the page loads I want the whole box to fade in at once or in some kind of order. I've been trying just to fade everything in at once using this:[code]And that it does nothing. The CSS for the box is just this: #leader{position:relative; height: 400px;How hard or were would I need to start if I were to try and fade each of them in starting at different times?

View 1 Replies View Related

JQuery :: Image Fading With Thumbnails?

Sep 29, 2010

I was viisitingand saw the images fade on the home page. It uses jquery and I was needing some assistance getting this working on my web site. Where would I locate any "how to" documentation?

View 1 Replies View Related

Jquery :: Fading One HTML Page Into Another?

Aug 12, 2011

Kind of what heading has stated: Ive got a button which when clicked takes you to another standard page of portfolio sites Ive created, but I was wondering is it possible to create an effect like a slideshow or "toTop = (Jquery plugin)" movement to crossover to the new page, thus adding a more dynamic approach ?

View 2 Replies View Related

JQuery :: FadeIn Flashes Before Actually Fading In

Apr 2, 2011

I'm new using jQuery and I have a problem trying to make a fadeIn work properly.My client asked that the main section of the site (which may contain images, text, etc, and it's the only section that changes when navigating the site; header and footer are static) enters with a fadeIn. I made it work with the following code between the <head></head> tags:[code]The problem is, when moving between sections, sometimes I get a quick glimpse of this main div before it disappears to enter, the second time, with the fadeIn. I've made slight changes to the code, more as an experiment than really knowing what I'm doing, but I get the same result. It doesn't happen all the time or in every section, though. Could this be 'normal' behavior or browser-related?

View 4 Replies View Related

JQuery :: Animate An Object While At The Same Time Fading It In?

Feb 23, 2011

I wonder if its possible to animate an Object while at the same time fading it in. At this moment I am able to do it after each other but not at the same time.

View 3 Replies View Related







Copyrights 2005-15 www.BigResource.com, All rights reserved