Expand image from slide show

idsanjeev

241 New Member

Hi
i have some image in slide show on load events. i wants to expand image on mouseover from slide show.
thanks

May 26 '08 #1

Subscribe Reply

3405

gits

5,390

Recognized Expert Moderator Expert

on mouseover just set the size and with of the currently hovered image ... post the code you have done so far.

kind regards

May 26 '08 #2

idsanjeev

241

New Member

on mouseover just set the size and with of the currently hovered image ... post the code you have done so far.

kind regards

Hello gits
code of fade image is work but i wants to on mouse over the image is expanded

Expand|Select|Wrap|Line Numbers

  
<script language="javascript" type="text/javascript">

<!-- Begin

// Set slideShowSpeed (milliseconds)

var slideShowSpeed = 1500;

// Duration of crossfade (seconds)

var crossFadeDuration = 3;
 
var Pic = new Array();

// to add more images, just continue

// the pattern, adding to the array below
 
Pic[0] = 'images/photo1.jpg'

Pic[1] = 'images/photo2.jpg'

Pic[2] = 'images/photo3.jpg'

Pic[3] = 'images/photo4.jpg'

Pic[4] = 'images/photo5.jpg'

Pic[5] = 'images/photo6.jpg'

Pic[6] = 'images/photo7.jpg'

Pic[7] = 'images/photo9.jpg'

Pic[8] = 'images/photo10.jpg'

Pic[9] = 'images/photo11.jpg'
 
// do not edit anything below this line

var t;

var j = 0;

var p = Pic.length;

var preLoad = new Array();

for (i = 0; i < p; i++) {

preLoad[i] = new Image();

preLoad[i].src = Pic[i];

}

function runSlideShow() {

if (document.all) {

document.images.SlideShow.style.filter="blendTrans(duration=2)";

document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";

document.images.SlideShow.filters.blendTrans.Apply();

}

document.images.SlideShow.src = preLoad[j].src;

if (document.all) {

document.images.SlideShow.filters.blendTrans.Play();

}

j = j + 1;

if (j > (p - 1)) j = 0;

t = setTimeout('runSlideShow()', slideShowSpeed);

}

window.onload=runSlideShow;

//  End -->
 
</script>

Expand|Select|Wrap|Line Numbers

  
<div style="position:absolute; top:0; left:0 ">

<img src="images/photo9.jpg" name='SlideShow' border="5px" style="border-color:#B812A7 " width="170PX"  height="140PX" title="Barauni Refinry">
 
</div>

thanks

May 26 '08 #3

gits

5,390

Recognized Expert Moderator Expert

let me give you an example:

[HTML]<html>
<script type="text/javascript">
function zoom_in(ele) {
ele.style.width = '400px';
ele.style.heigh t = '400px';
}
</script>

<body>
<img src="image.gif" onmouseover="zo om_in(this);">
</body>
</html>
[/HTML]
kind regards

May 26 '08 #4

idsanjeev

241

New Member

Hello gits
Thanks it works fine
i am usinng some frame so i wants to open it in popupwindow on mouseover and onmouse out close popup becouse size of frame where image fadein is very short its maximum width is 170px .

thanks

May 27 '08 #5

gits

5,390

Recognized Expert Moderator Expert

do you have a solution, or are you asking for one? in that case use window.open() in the shown function and append an image element with a src to the greater image to it ... on mouseover just use window_ref.clos e() ...

the better solution would be to use an inline div or google for lightbox in case you wnat to have some out of the box fancy stuff ...

kind regards

May 27 '08 #6

idsanjeev

241

New Member

i have solution of window.open() on mouseover and but i cant understands how can image show thats fade in

Expand|Select|Wrap|Line Numbers

  
new_window.document.open();
 
// Text of the new document

// Replace your " with ' or \" or your document.write statements will fail

new_window.document.write("<html><title>JavaScript New Window</title>");

new_window.document.write("<body bgcolor=\"#FFFFFF\">");

new_window.document.write("This is a new html document created by JavaScript ");

new_window.document.write("statements contained in the previous document.");

new_window.document.write("</body></html>");
 
// close the document

new_window.document.close(); 

}

May 27 '08 #7

idsanjeev

241

New Member

hello
I think i couldn't expalin clearly whats my need.
lets try to explain
i have four frame top,left,cetner and right
some images are display at right frame in fader
my needs onmouseover open a popup window and expand the image
i have code for popupwindow but havn't idea how to display image thats in fader
thanks

May 28 '08 #8

gits

5,390

Recognized Expert Moderator Expert

i'm not really sure that i get it ... are you looking for something like this:

in your image's onmouseover use:

Expand|Select|Wrap|Line Numbers

onmouseover="zoom_window(this);"

i assume your function now uses the code you posted above and now gets the ref to the currently clicked image passed to it. so you could use something like the following now:

Expand|Select|Wrap|Line Numbers

 function zoom_window(ref) {

    // some of your code 

    new_window.document.write('<img src="' + ref.src + '"/>');

    // more of your code

}

kind regards

May 28 '08 #9

hsriat

1,654

Recognized Expert Top Contributor

If I can jump into this, may I know if the OP wants something what happens in yahoo mail (the new one) when you click on an attachment image?

May 28 '08 #10

Similar topics

17095

Image Slideshow Pause onMouseOver

by: Tim | last post by:

Hope someone in the big wide world can help... What I want to do is have an image slideshow which automatically scrolls through a series of images very fast, then pauses when you move your mouse over the image. The images will flick through (at a rate of about 5 per second) then pause when the user onMouseOver's. Any help would be gratefully received. :o)

Javascript

2374

Need help with image loading

by: Mekon | last post by:

I have never written a line of script in my life but I need some help with it now. I have this auto generated code which I want to modify if possible The script generates a strip of thumbnails, and works quite well execpt that on dial up it is unbearably slow. The Thumbnails themselves are only 10kb but the total of them is a lot larger. and it appears to need to load them all before it will display any.

Javascript

17208

expand and collapse all

by: peter | last post by:

I use the click-to-expand menu at http://javascript.internet.com/navigation/click-to-expand-menu.html This works fine, but is there a way to expand or collapse all the menus? An example of how I use this is here: http://www.cod.edu/people/faculty/chenpe/PRAIRIE/index.html Thanks!

Javascript

1610

Download image with button click

by: aarondouglas28 | last post by:

Hey all, I'm hoping someone can help me with a problem I'm having. I have a page that has a javascript based slide show of images on it. The user can press a play button and the page will cycle through all of the images that match a certain criteria. At any point, the user can press the stop button to stop the slide show. What I need is a button on the page, that when clicked, will prompt the user to download the image that is currently...

ASP.NET

1370

e-View: freeware image viewer and slide-show*fully developed in .Net and GDI+

by: | last post by:

We have developed a free image-viewer for testing .Net and GDI+ capabilityes. e-View supports a lot of raster and vectorial image formats: -Bitmap (BMP) -Graphics Interchange Format (GIF) -Joint Photographic Experts Group (JPG) -Portable Network Graphics (PNG) -Tag Image File Format (TIFF)

.NET Framework

16491

Ajallerix : AJAX, simple, fast Web image gallery demo ; at Novell

by: www.web20developers.com | last post by:

http://www.web20developers.com http://www.web20developers.com/index.php?option=com_content&task=view... Ajallerix : AJAX, simple, fast Web image gallery demo ; at Novell AJAX - microlink pattern tutorial : A microlink is a link that opens up

Javascript

1965

_HELP Modifying Script Create Random Linked Image Blend Script

by: bn4 | last post by:

I have been trying to modify a script that i had working in the past but have lost.. ORIGINAL URL: http://www.thescripts.com/forum/thread147097.html STEPS: I want it to do the following: 1-Load a Random Image each time page loads or is refreshed / script starts (with corresponding url link when clicked) 2-Images change by blend/fade into one another, on an adjustable time delay 3-Next image loaded also loads new corresponding url/link

Javascript

2134

problem with image slide show

by: vineetbindal | last post by:

Hi all, We have a slide show in a page which shows slids rotating after every 8-10 seconds with some descriptions about them. The problem is if the connection speed is slow then the page loads fine but that slide show takes a lot of time to load and (the place we are running the slide show is white blank page till than) I dont understand why. can someone tell me what can we do for this. i have think of something like

Javascript

8811

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

8703

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...

Online Marketing

8467

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...

Windows Server

7302

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...

Career Advice

6160

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...

Microsoft Access / VBA

4145

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...

Networking - Hardware / Configuration

4291

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

2703

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

C# / C Sharp

1591

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

General