XOOPS 
Forum
Forum Index General Forums Community Support Modules Support Themes Support Development International Support Module Hack Reviews Theme Designer Talk
  1. Board index / 
  2. Xoops Development / 
  3. Xoops Development 
  4.  / HTML or JS
Register
1
burfodus
HTML or JS

  • 2008/12/7 14:14

  • burfodus

  • Just popping in

  • Posts: 94

  • Since: 2008/9/2 1


I figure this is the best place to get a quick answer, even though its not really a XOOPS problem.

I want to place 1 large image with 4 smaller images in a block and make the large image change when i click the smaller images.

problem is i dont know what this function is called so i cant search for it. when i google image swap i just get a load of mouse over effects or carousel type code offerings.

does one of you guys know what this is called, i should then be able to find a code example to use.

thx.
steve.
XOOPS Version - XOOPS 2.3.2
PHP Version - 5.2.6
MySQL Version - 5.0.67-community
Server API Version - apache2handler
OS Version - WINNT
2
tank1955
Re: HTML or JS

  • 2008/12/7 16:09

  • tank1955

  • Module Developer

  • Posts: 276

  • Since: 2007/9/7 1


I would try a search on "javascript" and "layers". The approach I would take would be to load all full size images correlating to the thumbnails, each on a different layer. Which layer (or image) is being displayed would be determined by the "Z-order". This would be controlled by an onclick event tied to each thumbnail.

This is just off the top of my head. Hope it helps.
3
ghia
Re: HTML or JS

  • 2008/12/7 22:30

  • ghia

  • Community Support Member

  • Posts: 4953

  • Since: 2008/7/3 1


Give your big image an id.

Specify a mouseover event for the little ones:
<img src="/images/little_pic1.jpg"
 id="little1"
 width="50"
 class="littleimg" 
 alt="alt 1"
 onmouseover="javascript:setImage('/images/big_pic1.jpg');"
 />

and a little script
function setImage(imageurl) {
   document.getElementById('id_big_image').src=imageurl;
}

4
burfodus
Re: HTML or JS

  • 2008/12/8 4:00

  • burfodus

  • Just popping in

  • Posts: 94

  • Since: 2008/9/2 1


champions, ill give it a go.
thx

steve.
XOOPS Version - XOOPS 2.3.2
PHP Version - 5.2.6
MySQL Version - 5.0.67-community
Server API Version - apache2handler
OS Version - WINNT
5
burfodus
Re: HTML or JS

  • 2008/12/12 0:40

  • burfodus

  • Just popping in

  • Posts: 94

  • Since: 2008/9/2 1


Works a charm, thanks a million.

cheers
steve.
XOOPS Version - XOOPS 2.3.2
PHP Version - 5.2.6
MySQL Version - 5.0.67-community
Server API Version - apache2handler
OS Version - WINNT

Login

Register now!  |  Lost Password?

Search

Advanced Search

Recent Posts

Who's Online

211 user(s) are online (147 user(s) are browsing Support Forums)

Members: 0

Guests: 211

more...

Donat-O-Meter

Stats
Goal: $100.00
Due Date: Apr 30
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits