|
JavaScript - How Can I Make This Script To Work
I have 3 HTML form inputs fields that is dynamically generated by a "add more" button, with naming for the fields name as fieldName, fieldName1, fieldName2, fieldName3, and so on.
Now, I'm trying to retrieve the value from this fields with JavaScript, using the script below. var bookingForm = document.forms['formName']; var qty = bookingForm.fieldName +'i'.value; with the 'i' been a generated numeric number by a for loop when I use alert(qty), it returns NaN, when I'm expecting the value for fieldName1, fieldName2, and so on. But when I use; var qty = bookingForm.fieldName.value I can get the value in that field but get NaN when I try to concatenate 1,2,3, with the fieldName. Any help will be very much appreciated. Similar TutorialsHello! I have the following code that I just can't seem to get to work. Here are the issue that aren't working: 1. The items that are stored in the users account aren't showing up as selected when you enter the page. (They work in IE, not Chrome) 2. When you click the items, nothing happens. (It used to work and would add the item to the top image) If you need any more info, or more of the code, let me know. I removed most of the PHP to simplify it for revising, and I didn't include it's CSS. Code: <div id="avatar_form" width="95" height="141">
</div>
<div id="avatar_stack">
<p>
<img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Extras]" type="radio" value="blank" <? if($prof[base]==blank) echo("checked='checked'");?> />
</p>
<p>
<img src="hs/news/Upload/images/skin1.gif" alt="" /><input name="avatar[Skin Tone]" type="radio" value="body1" <? if($prof[skin]==body1) echo('checked="checked"');?> <? if($prof[skin]==blank) echo("checked='checked'");?> />
</p>
<p>
<img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Hair]" type="radio" value="blank" <? if($prof[hair]==blank) echo("checked='checked'");?> />
</p>
<p>
<img src="hs/news/Upload/images/girlface.gif" alt="" /><input name="avatar[Face]" type="radio" value="girlface" <? if($prof[face]==girlface) echo("checked='checked'");?> />
</p>
<p>
<img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Hand Item]" type="radio" value="blank" <? if($prof[handitem]==blank) echo("checked='checked'");?> />
</p>
<p>
<img src="hs/news/Upload/images/shirt6.gif" alt="" /><input name="avatar[Shirt]" type="radio" value="shirt6" <? if($prof[shirt]==shirt6) echo("checked='checked'");?> />
</p>
<p>
<img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Hat]" type="radio" value="blank" <? if($prof[hat]==blank) echo("checked='checked'");?> />
</p>
<p>
<img src="hs/news/Upload/images/pants7.gif" alt="" /><input name="avatar[Pants]" type="radio" value="pants7" <? if($prof[pants]==pants7) echo("checked='checked'");?> />
</p>
<p>
<img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Shoes]" type="radio" value="blank" <? if($prof[shoes]==blank) echo("checked='checked' checked");?> />
</p>
<p>
<img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Accessories]" type="radio" value="blank" <? if($prof[accessory]==blank) echo("checked='checked' checked");?> />
</p>
<p>
<img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Costume]" type="radio" value="blank" <? if($prof[costume]==blank) echo("checked='checked' checked");?> />
</p>
</div>
<BR><BR><BR>
<script type="text/javascript">
var avatar_layers = new Array('Extras', 'Skin Tone', 'Hair', 'Face', 'Hand Item', 'Shirt', 'Hat', 'Pants', 'Shoes', 'Accessories', 'Costume')
var layer_colours = new Array('#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff')
var inactive_tab_background_colour = '#fff'
var inactive_tab_bottom_border_colour = '#fff'
var stack_height = 1
var on_top = 0
var key = null
onload = layout
function layout()
{
if(!document.getElementById('avatar_section')) return
document.onkeydown = keyhit
tabs()
hide_radio_buttons(document.getElementById('avatar_stack'))
StackImageHolders('avatar_stack');
P = document.getElementById('avatar_stack').getElementsByTagName('p')[on_top]
P.style.backgroundColor = layer_colours[on_top]
P.style.zIndex = stack_height++
LIs = document.getElementById('avatar_section').getElementsByTagName('li')
for(i=0; i<LIs.length; i++)
{
LIs[i].style.backgroundColor = inactive_tab_background_colour
LIs[i].style.borderBottomColor = inactive_tab_bottom_border_colour
}
LIs[on_top].style.backgroundColor = layer_colours[on_top]
LIs[on_top].style.borderBottomColor = layer_colours[on_top]
LIs[on_top].focus()
IMGs = document.getElementById('avatar_stack').getElementsByTagName('img')
for(i=0; i<IMGs.length; i++)
{
IMGs[i].className = 'black_border'
IMGs[i].style.cursor = 'pointer'
IMGs[i].onclick=function(){ChangeGarment(this)}
}
avatar_preview_and_hotkey_text()
update_avatar(document.getElementById('avatar_stack').firstChild)
/* I added the following two lines because Internet Explorer
wasn't updating the display properly after loading */
document.getElementsByTagName('body')[0].style.width='95';
document.getElementsByTagName('body')[0].style.width='95';
}
function keyhit(e)
{
thisKey = e ? e.which : window.event.keyCode
alt_key_down = e ? e.altKey : window.event.altKey
ctrl_key_down = e ? e.ctrlKey : window.event.ctrlKey
shift_key_down = e ? e.shiftKey : window.event.shiftKey
switch (thisKey) {
case 37: key = 'LEFT'
break
case 39: key = 'RIGHT'
break
default: key = null
}
if(key && alt_key_down && ctrl_key_down)
{
IMGs = document.getElementById('avatar_stack').getElementsByTagName('p')[on_top].getElementsByTagName('img')
for(i=0; i<IMGs.length; i++)
{
if(IMGs[i].className == 'red_border')
{
if((key == 'LEFT') && (i > 0))
{
i--
ChangeGarment(IMGs[i])
return
}
if((key == 'RIGHT') && (i < (IMGs.length - 1)))
{
i++
ChangeGarment(IMGs[i])
return
}
}
}
}
else if(key && alt_key_down && shift_key_down)
{
LIs = document.getElementById('avatar_section').getElementsByTagName('li')
if((key == 'LEFT') && (on_top > 0))
{
on_top--
bring_to_the_top(LIs[on_top])
return
}
if((key == 'RIGHT') && (on_top < (LIs.length - 1)))
{
on_top++
bring_to_the_top(LIs[on_top])
return
}
}
}
function tabs()
{
list = document.createElement('ul')
for(i=0; i<avatar_layers.length; i++)
{
list_item = document.createElement('li')
list_item.appendChild(document.createTextNode(avatar_layers[i]))
list_item.onmouseover=function(){this.className='mouse'}
list_item.onmouseout=function(){this.className=''}
list_item.tab_number=i;//faux attributes to "stick" the indexes i and j values
list_item.onclick=function(){
bring_to_the_top(this)
}
list_item.onfocus=function(){
bring_to_the_top(this)
}
list.appendChild(list_item)
}
document.getElementById('avatar_section').insertBefore(list, document.getElementById('avatar_stack'))
}
function hide_radio_buttons(caller)
{
INPUTs = caller.getElementsByTagName('input')
for(i=0; i<INPUTs.length; i++)
{
if(INPUTs[i].type == 'radio')
{
INPUTs[i].style.display = 'none';
}
}
}
function StackImageHolders(caller)
{
Ps = document.getElementById(caller).getElementsByTagName('p')
for(i=0; i<Ps.length; i++)
{
Ps[i].className = 'stack'
}
}
function avatar_preview_and_hotkey_text()
{
for(i=0; i<avatar_layers.length; i++)
{
preview = document.createElement('img')
preview.id = avatar_layers[i]
preview.className = 'preview'
preview.width = '95px'
preview.height = '141px'
preview.alt = 'avatar preview image'
document.getElementById('avatar_stack').appendChild(preview)
}
hotkey_text = document.createElement(' ')
hotkey_text.className = 'hotkeys'
hotkey_text.appendChild(document.createTextNode(''))
document.getElementById('avatar_stack').appendChild(hotkey_text)
}
function update_avatar(caller)
{
INPUTs = caller.parentNode.getElementsByTagName('input')
for(i=0; i<INPUTs.length; i++)
{
if(INPUTs[i].type == 'radio')
{
if(INPUTs[i].checked)
{
document.getElementById(INPUTs[i].name.match(/^.*[(.*)]$/)[1]).src='hs/news/Upload/images/' + INPUTs[i].value + '.gif'
INPUTs[i].previousSibling.className = 'red_border'
}
else
{
INPUTs[i].previousSibling.className = 'black_border'
}
}
}
}
function ChangeGarment(caller)
{
inputs = caller.parentNode.getElementsByTagName('input')
for(i=0;i<inputs.length;i++)
{
inputs[i].checked=false
}
caller.nextSibling.checked=true
update_avatar(caller)
}
function bring_to_the_top(caller)
{
tabs = document.getElementById('avatar_section').getElementsByTagName('li')
for(i=0; i<tabs.length; i++)
{
tabs[i].style.backgroundColor = inactive_tab_background_colour
tabs[i].style.borderBottomColor = inactive_tab_bottom_border_colour
}
on_top = caller.tab_number
caller.style.backgroundColor = layer_colours[caller.tab_number]
caller.style.borderBottomColor = layer_colours[caller.tab_number]
put_on_top = document.getElementById('avatar_stack').getElementsByTagName('p')[caller.tab_number]
put_on_top.style.zIndex = stack_height++
put_on_top.style.backgroundColor = layer_colours[caller.tab_number]
}
</script>
I am trying to make the following fill the value box when the page loads as opposed to pressing the button. I cant seem to do it. Any ideas?? PHP Code: <script> var keylist="abcdefghijklmnopqrstuvwxyz123456789" var temp='' function generatepass(plength){ temp='' for (i=0;i<plength;i++) temp+=keylist.charAt(Math.floor(Math.random()*keylist.length)) return temp } function populateform(enterlength){ document.pgenerate.output.value=generatepass(enterlength) } </script> <form name="pgenerate"> <input type="text" size=18 name="output"> <input type="button" value="Generate Password" onClick="populateform(this.form.thelength.value)"><br /> <b>Password Length:</b> <input type="text" name="thelength" size=3 value="7"> </form> Right now, it only works with IE. This goes in the header... Quote: <script language="JavaScript1.2"> function makevisible(cur,which){ strength=(which==0)? 1 : 0.2 if (cur.style.MozOpacity) cur.style.MozOpacity=strength else if (cur.filters) cur.filters.alpha.opacity=strength*100 } </script> and this goes in the image: Quote: <img style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)" src="SOURCE OF IMAGE"> It works great in IE, but not firefox or chrome. Any way I can alter this to get it to work in all 3 or at least Firefox and IE. Thanks for the help! Hi All, I have two scripts which I want to try and integrate. I am using a nice gallery script to show thumbnails which are appended to a an image wrapper which on click of the thumbnail shows the larger image in the image wrapper, I am trying to implement cloud zoom which is a plugin which uses image srcs to then point to an anchor href to show another larger zoom image either in the same place.. which is what I am trying to do or in another div beside. I have had to set me img srcs up in a certain way to easily enter some product details. and I need to try an manipulate the code to make it work to suit my file layout. I am using a var= images [ with a series of file locations and info such as below { src: 'romanticabride/thumbs/tn_Shauna.jpg', srcBig: 'romanticabride/images/Shauna.jpg', title: 'Shauna', longDescription: '<b><H1>Shauna</H1></b><br><b>Romantica Of Devon <br><br><h2>Sizes Available:</h2><br> 6 - 32.<b><br><b><br><b><b><b><H2>Colours Available:</h2><b><br>Various<br>Please Enquire Below<br><br><br><br><a href="mailto:tracy@cherishbridal.co.uk?subject=Web Enquiry Regarding Romantica Shauna Bridal Gown"class="enquiry rose glow" >Click To Enquire About This Item </a>' }, what I need is for cloud zoom to work when the main image wrapper is hovered over which means it will need to add a class or when the whichever srcBig: is hovered over it gets wrapped by href to make the script work . one of my pages is http://www.cherishbridal.co.uk/romaticabride.html the cloud zoom script is at http://www.professorcloud.com/mainsite/cloud-zoom.htm.. I am happy to share a jsfiddle with someone or explain further or post some code. Thank you in advance Hello all, I made a fade script that will fade any element in or out. Works great on all browser I've tested but IE 7. With IE I have only tested this will IE 8 and IE 7. IE 7 the effect doesn't work. No error message or anything. I'm unsure what to do from here. I was hoping I could find some help here. Code: function fade(obj, duration, toggle) {
steps = 1000;
elem = document.getElementById(obj);
function fadeIn() {
for(var i = 0; i <= 1; i+=(1/steps)) {
setTimeout("elem.style.opacity = "+ i +"", i * duration);
setTimeout("elem.style.filter='alpha(opacity="+ i * 102 +")'", i * duration);
}
}
function fadeOut() {
for(var i = 0; i <= 1; i+=(1/steps)) {
setTimeout("elem.style.opacity = "+ (1-i) +"", i * duration);
setTimeout("elem.style.filter='alpha(opacity="+ (1-i) * 102 +")'", i * duration);
}
}
/* One for Fade in and anything will be fade out*/
if(toggle == 1) {
fadeIn();
}
else {
fadeOut();
}
}
Thanks, Jon W I need to assign a key in the javascript to actually make the javascript work,. I have a bookmark in chrome , a javascript , which actually works when clicked on it .,. but how can i edit it so that i can actually make it work on click a key or combination of keys. i want to declare the key or keycombo in the script itself .,. the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,., So I want it to work it this way ., select the text press a key and it opens a new tab (or window) with an xact search .,. i want to declare the key or keycombo in the script itself .,. the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,., So I want it to work it this way ., select the text press a key and it opens a new tab (or window) with an xact search .,. Thanks in advance ., Nani I am terrible at this. I want to get this functionality seen here http://davidlynch.org/js/maphilight/docs/demo_usa.html (image map areas highlighting on mouseover) to work on this here http://scratchitrich.com/test/ can anybody walk me through how to make this work? Thanks! Code: <script type="text/javascript">
<!--
NS4 = (document.layers) ? true : false;
function launchVsee2() {
try {
location='vsee:';
} catch (err) {
location='http://www.vsee.com';
return true
}
}
//-->
</script>
This app works as a URI and can be triggered to run in an address bar, when launched it will launch the app. Now, I can get this script to run in Firefox; it will test for the URI and if not avail it will redirect to the site website of that app. However when I run this in IE it will just load a page that says the site is in valid and not redirect. Anyone have any tips on how to get this working in IE. ALSO in addition this will not run in Safari either; same issue as IE. Thanks in advance I have this javascript code in this html page and it works fine. As soon as I try to add it to an existing page, it doesn't work. I have tried every position for the form and the script that I can think of but to no avail. I would greatly appreciate soon expert guidance. Frank. The code page is here. The page that I am trying to add it to is here. How would I go about having this work for Firefox. Is there away to have JQuery work with it? Code: <script type="text/javascript">
region=[//2 dimensional array containing area codes and region pairs
["201","nj"],
["202","dc"],
]
function getRegion(code){
index=0;
while(true){
console.log(index);
if(region[index][0]==code){
return(region[index][1]);
}
index++;
if(index>=region.length){
return(undefined);
}
}
}
function getLocation(number){
out=document.getElementById('output');
var answer;
if(number.length<3){
return(void(0));
}
else{
var code=number.substring(0,3);
answer=getRegion(code)
if(answer==undefined){
out.innerText="unknown area code";
}
else{
out.innerText=answer;
}
}
}
</script>
...
<form>
<input type="text" id="number" onkeyup="getLocation(this.value)">
</form>
<div id="output">
</div>
Hi-- I have a link that has an mp3 sound as its href: Code: <a href="sounds/genealogy.mp3" class="track track-default">this is a link</a> Unfortunately, I also need that same link to go to a part on the site (href=#greenhouse) so that the sound plays on that part of the site. Does anyone know how to accomplish this? I am imagining it would be with javascript, but honestly, I do not know. Any help would be greatly appreciated. Many thanks...! So I have made a website that you need a password to get into. The following javascript code works in Internet Explorer but, I need it to work in Safari also. Can anyone please rewrite this code, as simple as possible, to work in both Safari and Internet Explorer ? [CODE ]<!--// function mainpass() { if (pass.value=="password") {location="correct.HTML"}; else{location="wrong.HTML"}; } //--> [/CODE] Thanks in advance... I've got this listbox full of hundreds of employee names. Clicking on a name executes a function using onchange. Because of the length of the list I decided a search function would be really handy and I finally found one that works. Now the search function, when you type in the input box, scrolls the list to the first matching entry. And that's good, that's what I wanted. The problem comes in when you try to click on the name the search function found. Nothing happens ofcourse because the onchange tag in the list reacts to changes, not direct clicks. <select onchange="display.apply(this, this.value.split(','))" multiple="multiple" id="People" name="People" style="border-style: none; height:260px; width:220px; margin-bottom: 15px;"> <option selected="selected">Loading</option> </select> The list is populated by java but for testing I disabled the function that clears the "Loading" option and I set it to selected. That way the loading option is highlighted by default and the search function is free to highlight something else, then when I click on the search result it works like it's supposed to. But keeping a highlighted option at the top of the list for that sole purpose isn't very elegant, especially since if you click on it the onchange function tries to execute and generates errors. The only solution I can think of is to use java to generate another option way at the bottom of the list that has the selected attribute but I don't quite know how to do that. Does anyone have any thoughts on what I can do? Hi, I am using this script Code: <script type='text/javascript'>
var defaultnoimage="http://1.bp.blogspot.com/_u4gySN2ZgqE/SosvnavWq0I/AAAAAAAAArk/yL95WlyTqr0/s400/noimage.png";
var maxresults=14;
var splittercolor="none";
var relatedpoststitle="Related Results";
</script>
As you can see it has a variable that lets me give a name to the results, in this case I have used Related Results. This code is used once at the back and in that way it used by my every page. So e-g if I change it to More Results it will changed everywhere on all pages. I don't want it like this, I want to be able to give a different name to every page like on one it is like 'More Images Results' while on 2nd it is something else. you can see a demo here at this page http://bloghutsbeta.blogspot.com/201...ng-slider.html Okay I'm trying to make a script where if I click on a link a div pops up. And if I click on another link another div pop ups up and the old div is closed. The script calls the function from the link in the html and sends an ID. I am confused as to why this doesn't work. Code: function controls(vtiles){/*ID of requested div*/
vtiles.style.ClassName='switchOn'; //change it's classname to something that's displayed
var cap=document.getElementsByTagName('div');// get every div element
for(i=0;i<cap.length;i++) // make some kina loop with the number of divs
{
var store=cap[i].ClassName;
if(store=='switchOn' && cap.[i].id);
{ /*look for div's that are on (switchOn) and check to see if they have and ID*/
var check = cap.[i].id //store their IDs
if(check!=vtiles){//check to see if the id is the one stored in Vtiles
store=='switchP'//change the classname to switchP(off)
}
}
}
}
Code: <div class="content"><a class="Atiles" href="#" onclick="controls(document.getElementById('Ankara'))">Ankara</a></div>
<div id="Ankara" class="switchP">
Code: .switchP{
position:absolute;
display:none;
z-index:-1;
left: 20px;
top:40px;
}
.switchOn{
position:absolute;
display:block;
z-index:100;
left: 20px;
top:40px;
width:200px;
height:200px;
}
hey I'm a bit confused, I really am looking for some javascript tutorials so I don't have to keep asking for help. Total javascript noob here, but managed to get this working: Code: $(document).ready(function() {
if ((screen.width>=1024) && (screen.height>=768))
{
$("link[rel=stylesheet]:not(:first)").attr({href : "wp-content/themes/rabbithole/css/detect1024.css"});
}
else
{
$("link[rel=stylesheet]:not(:first)").attr({href : "wp-content/themes/rabbithole/css/detect800.css"});
}
if ((screen.width>=1280) && (screen.height>=1024))
{
$("link[rel=stylesheet]:not(:first)").attr({href : "wp-content/themes/rabbithole/css/detectlarge.css"});
}
});
Like i said, its working fine. However i was hoping to make it also work on the fly, so if the user resizes the window, the different stylesheets are used. Ive been told to: 1. Put the working gubbins into a separate function and 2. Call the function from both load and resize events - But i dont know how to do this. Any help would be really appreciated! Hi, I have a script that shows/hides a div but rather than making it sort of snap I would like to make it glide/slide. I have looked at other scripts but can't make them work with mine. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>test</title>
<style type="text/css" media="screen">
/* CSS Reset */
* {
margin: 0;
padding: 0;
border: 0;
outline: 0;
}
body {
font-family: Arial, Helvetica, sans-serif;
background-color: #FFFFFF;
color:#FF0000;
}
a:link {
color: #999999;
text-decoration: none;
letter-spacing: 3px;
font-size:14px;
}
a:visited {
color: #999999;
text-decoration: none;
letter-spacing: 3px;
font-size:14px;
}
a:hover {
color: #FF0000;
letter-spacing: 3px;
text-decoration: none;
font-size:14px;
}
a:active {
color: #FF0000;
font-size:14px;
letter-spacing: 3px;
}
#wrapper{
position:relative;
width:730px;
height:600px;
margin:0px auto;
}
#images{
width:730px;
height:552px;
overflow:hidden;
float:right;
position: absolute;
top: 48px;
}
#textbox{
position: absolute;
width:205px;
height:40px;
background-color: #FFFFFF;
top: 68px;
left: 20px;
z-index: 2;
padding: 10px;
border-bottom: 2px solid red;
}
#logo {
position: absolute;
width: 101px;
position: absolute;
left: 634px;
top: 19px;
padding: opx;
margin: 0px;
z-index: 2;
}
.more {
display: none;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
background-color: #FFFFFF;
border-bottom: 2px solid red;
padding-left: 8px;
padding-right: 8px;
margin-left: -10px;
width: 209px;
padding-bottom:10px;
}
a.mo hover {
text-decoration: none;}
a.showLink, a.hideLink {
text-decoration: none;
font-size: xx-small;
color: #36f;
padding-left: 8px;
/*** background: transparent url(down.gif) no-repeat left;***/ }
a.hideLink {
/*** background: transparent url(up.gif) no-repeat left;***/ }
.drop1 {
font-size: 12px;
font-weight: bold;
}
.drop2 {
color: #666666;
font-size: smaller;
}
#apDiv1 {
position:absolute;
left:319px;
top:87px;
width:234px;
height:32px;
z-index:1;
}
.init_image, .inactive_class {
}
.hover_class, #active_id {
color:#F00;
}
</style>
<script language="javascript">
function toggle() {
var ele = document.getElementById("toggleText");
var text = document.getElementById("displayText");
if(ele.style.display == "block") {
ele.style.display = "none";
text.innerHTML = "<img src=ShowProduct.jpg border='0'>";
}
else {
ele.style.display = "block";
text.innerHTML = "<img src=hideProduct.jpg border='0'>";
}
}
</script>
<script type="text/javascript">
// Reference URL to large images here
var Images = new Array(
"001.jpg",
"002.jpg",
"003.jpg",
"004.jpg"
);
function swap(el) {
var timgs=document.getElementsByTagName('a')
for (var i_tem = 0; i_tem < timgs.length; i_tem++)
if (timgs[i_tem].className=='inactive_class'||timgs[i_tem].className=='hover_class')
timgs[i_tem].id=''
el.id='active_id'
document['imgMain'].src = Images[el.href.substr(el.href.lastIndexOf('#')+1)];
}
function init(){
var timgs=document.getElementsByTagName('a')
for (var i_tem = 0; i_tem < timgs.length; i_tem++)
if (timgs[i_tem].className=='init_image'){
timgs[i_tem].className='inactive_class'
timgs[i_tem].onmouseover=function(){this.className='hover_class'}
timgs[i_tem].onmouseout=function(){this.className='inactive_class'}
timgs[i_tem].onclick=function(){swap(this);return false;}
}
swap(document.getElementById('first'));
}
</script>
</head>
<body onLoad="init();">
<div id="wrapper">
<div id= logo><img src="logo2.png" width="101" height="92" /></div>
<div id="textbox">
<div style="position:relative;">
<img style="padding-right:5px;" src="logo_dedon.png" alt=""/>
<a href="javascript:toggle();" id="displayText"><img src=ShowProduct.jpg border="0"></a>
<img style="padding-right:5px;" src="clear.gif" alt="" width="135" height="10" />
<a class="init_image" id="first" href="#0">1</a>
<a class="init_image" id="first" href="#1">2</a>
<a class="init_image" id="first" href="#2">3</a>
<a class="init_image" id="first" href="#3">4</a>
</div>
<div id="toggleText" style="display: none;" class="more">
<p><span class="drop1">BARCELONA</span><br />
<span class="drop2">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin non mi in urna hendrerit tincidunt. Maecenas eleifend erat et lacus. Sed tempor. Sed venenatis consequat neque. Sed massa. Donec quis orci sed lacus ullamcorper venenatis. </span></p>
</div>
</div>
<div id="images">
<div><img galleryimg="no" name="imgMain" src="img/big/1big.jpg" alt=""></div>
</div>
</div>
</body>
</html>
Can anyone advise a solution for this please? Thanks alot Joe I want to display a pdf on my site but allow the users to turn the pages like amazon does - how do I go about this? Is it something that can be done in javascript?
How do I make my Script load faster? Is there Code that will make my Script load faster, (so that it won't take so long to view) If so, can someone show me how to incorporate it into my Example Script? With appreciation |
|||||||