473,569 Members | 2,406 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

changing image without javascript

Is there way change image (swap) on click on thumbnail without
javascript? I.e. main image is big(preview), and below it is two small
images - when click on small image, it should change big image. All on
one page, without opening new windows.
Mar 2 '08 #1
6 2225
mistral wrote:
Is there way change image (swap) on click on thumbnail without
javascript? I.e. main image is big(preview), and below it is two small
images - when click on small image, it should change big image. All on
one page, without opening new windows.
That is only possible via a pagerefresh.
Make the thumbnail a hyperlink to some page on your server that return
the new page, including the bigger picture or whatever more you want on
that page.

Without javascript you are stuck with static pages with HTML and CSS.

Regards,
Erwin Moller
Mar 3 '08 #2
Erwin Moller wrote on 03 mrt 2008 in comp.lang.javas cript:
mistral wrote:
>Is there way change image (swap) on click on thumbnail without
javascript? I.e. main image is big(preview), and below it is two small
images - when click on small image, it should change big image. All on
one page, without opening new windows.

That is only possible via a pagerefresh.
Make the thumbnail a hyperlink to some page on your server that return
the new page, including the bigger picture or whatever more you want on
that page.

Without javascript you are stuck with static pages with HTML and CSS.
Or use vbscript and be stuck with IE. ;-(

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Mar 3 '08 #3
On Mar 3, 11:12 am, mistral <polych...@soft home.netwrote:
On 3 ÍÁÒ, 11:55, Erwin Moller

<Since_humans_r ead_this_I_am_s pammed_too_m... @spamyourself.c omwrote:
mistral wrote:
Is there way change image (swap) on click on thumbnail without
javascript? I.e. main image is big(preview), and below it is two small
images - when click on small image, it should change big image. All on
one page, without opening new windows.
That is only possible via a pagerefresh.
Make the thumbnail a hyperlink to some page on your server that return
the new page, including the bigger picture or whatever more you want on
that page.
Without javascript you are stuck with static pages with HTML and CSS.
Regards,
Erwin Moller

------------

I mean something like image preview on ebay , without refreshing page:

http://cgi.ebay.com/ws/eBayISAPI.dll...28278479&ru=ht....

is there simplified version?
No. The best you can do is changing the image via "active" or "hover"
selectors (whatever those are called) on CSS elements like an "anchor
(a)".
Mar 3 '08 #4
20:05, "endangeredma.. .@gmail.com" <endangeredma.. .@gmail.comwrot e:
11:12 am, mistral <polych...@soft home.netwrote:
On 3 ÍÁÒ, 11:55, Erwin Moller
<Since_humans_r ead_this_I_am_s pammed_too_m... @spamyourself.c omwrote:
mistral wrote:
Is there way change image (swap) on click on thumbnail without
javascript? I.e. main image is big(preview), and below it is two small
images - when click on small image, it should change big image. All on
one page, without opening new windows.
That is only possible via a pagerefresh.
Make the thumbnail a hyperlink to some page on your server that return
the new page, including the bigger picture or whatever more you want on
that page.
Without javascript you are stuck with static pages with HTML and CSS.
Regards,
Erwin Moller
------------
I mean something like image preview on ebay , without refreshing page:
>http://cgi.ebay.com/ws/eBayISAPI.dll...28278479&ru=ht....
is there simplified version?
-------------
No. The best you can do is changing the image via "active" or "hover"
selectors (whatever those are called) on CSS elements like an "anchor
(a)".-
----------------------

Could you please be so kind to show me working example of that
approach? Also, there is only description section (inside body)
available for user html - no access to head section.

Thanks.
Mar 3 '08 #5
SAM
mistral a ¨¦crit :
You've omitted image height attributes just to simplfy examples,
however, we can set it as required?
usually no need of sizes for image, the browser knows what to do ...

Here to fixe the size of image giving its width is enough
Like that its height followes proportionnaly
Here some explain :
<http://cjoint.com/data/detZ2C7fT4_imag e_table_wout-js.htm>

--
sm
Mar 4 '08 #6
On 4 §Þ§Ñ§â, 20:53, SAM <stephanemoriau x.NoAd...@wanad oo.fr.invalid>
wrote:
mistral a ¨¦crit :
You've omitted image height attributes just to simplfy examples,
however, we can set it as required?
usually no need of sizes for image, the browser knows what to do ...
Here to fixe the size of image giving its width is enough
Like that its height followes proportionnaly
Here some explain :
<http://cjoint.com/data/detZ2C7fT4_imag e_table_wout-js.htm>
--
sm
------------

Great explanation! Thank you very much.

mistral
Mar 4 '08 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
2198
by: Ron Brennan | last post by:
Good morning. I have a page displayed and want to get information from a user using showModalDialog, and then send a request to the server for more information based on the user info from the showModalDialog - without changing the displayed page. Is this possible? Thanks.
14
11039
by: D. Alvarado | last post by:
Hello, I am trying to open a window containing an image and I would like the image to be flush against the window -- i.e. have no padding or border. Can I make this happen with a single call to a window.open function? I would prefer not to create a separate HTML page. So far all I have is the basic var cwin =...
31
4101
by: Greg Scharlemann | last post by:
Given some recent success on a simple form validation (mainly due to the kind folks in this forum), I've tried to tackle something a bit more difficult. I'm pulling data down from a database and populating a simple table. I'd like the table to contain 10 entries per page and have the option for the user to scroll through the pages of data...
2
2500
by: Paolo Pignatelli | last post by:
I am trying to get an output/file like this (below) in an XML file (MyXmlFile.xml) (which I will use for a slide show) -- <gallery timer="3" order="sequential" fadetime="2" looping="yes" xpos="0" ypos="0"> <image path="images2/Test1.jpg" />
4
3464
by: Doug van Vianen | last post by:
Hi, I have the following coding on a web page. It causes two pictures (pic1.jpg and pic2.jpg) to show, one above the other and then when one clicks on the top picture is squeezes to the left (as its width is reduced) to show the bottom picture. Then when the bottom picture is clicked the top picture expands to the right to cover the...
2
7503
by: reynardmh | last post by:
I tried to change the image.src on the fly when the user click a link. But for some reason it does not work in IE 6 (the image just disappear when I click the link), but if I add the alert('test') line on the change_pic function it works in IE. it's like IE just didn't refresh the display with the new image. Btw, the code works fine on Firefox...
8
1516
by: GabrielESandoval | last post by:
i currently use the code below to create a slideshow of images. i edited it so that its not as long. i currently have over 20 images i want to change it so that the images dont appear in the same order each time. what would i have to change to make the cycle random??? thanks in advance for the help. gabriel -- heres the code --
3
7336
by: bulldog8 | last post by:
I am having problems with changing a frames source file for Mozilla (1.5.0.4). The followig code works for IE: <script type="text/javascript"> var imgP = new Image(); function ShowPic(ShowThis, wdth, hght) { imgP.src = "../pics/' + ShowThis + '" xw = 500; yh = 500*(hght/wdth); window.document.getElementById("graphic").innerHTML = '<img...
7
1747
by: Milenec | last post by:
Hi, so I was making this photo-gallery, and was using some javascript to make it look a little better, as in not having to refresh the entire page when you click on a thumbnail. I've gotten quite far with it, especially since most of it comes from google searches (I really don't know much about Javascript), but there is one thing that still...
0
7618
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language...
0
7926
Oralloy
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. ...
0
8132
jinu1996
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...
0
7982
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the...
0
6286
agi2029
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...
0
3656
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...
1
2116
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
1
1226
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
0
944
bsmnconsultancy
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...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.