|
JavaScript - Cannot Add Links To Changing/rotating Text Lines
Hi all,
I hoping somebody can help me. I'm trying to acheive a line of text (with multiple links on each line) that change at set intervals. The code below seems to be working but I can only get working links on the first line that appears. Please can somebody help a gal out? xo [CODE] <html> <head> <title>Rotating Text</title> <script type="text/javascript"> var rotatingTextElement; var rotatingText = new Array(); var ctr = 0; function initRotateText() { rotatingTextElement = document.getElementById("textToChange"); rotatingText[0] = rotatingTextElement.innerHTML; rotatingText[1] = "why won't you work!?!?!?"; rotatingText[2] = "purdy please"; setInterval(rotateText, 5000); } function rotateText() { ctr++; if(ctr >= rotatingText.length) { ctr = 0; } rotatingTextElement.innerHTML = rotatingText[ctr]; } window.onload = initRotateText; </script> </head> <body> <span id="textToChange">log into your <a href="http://www.hotmail.com/">please</a> policy.</a> | can you <a href="http://www.google.com"> me?</a> </span> </body> </html> Similar TutorialsOk so i have wrote some code which can be seen he http://www.runningprofiles.com/members/include/test.php This works great but when i add the code to the page i want it on (include "include/test.php" for some reason the code does not work... the text is delayed and then lags behind the images.. this can been seen here http://www.runningprofiles.com/members/ I have no idea why its happening! Code for the code is Code: <html>
<head>
<title>http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q__26659912.html</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript">
function advance()
{
$("#slideshow").cycle("next");
cycleCaption();
}
var displayedIndex = 0
function cycleCaption()
{
$("#caption").children().each( function(index) {
$(this).css("font-weight", (index==displayedIndex)? "bold" : "normal" );
});
displayedIndex = (++displayedIndex==$("#caption").children().length)? 0 : displayedIndex;
}
$(function() {
$("#slideshow").cycle({ timeout: 0 });
$("img").each( function() {
$("<div />").html($(this).attr("title")).appendTo($("#caption"));
});
cycleCaption();
setInterval( "advance()", 2000 );
});
</script>
</head>
<body>
<div id="slideshow" style="float: left;">
<img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14882_jruqg6x4uu6frw2g872b.jpg" title="Aisling Cuffe Before Foot Locker" />
<img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14879_mzcgn05auhs24fnsygc1.jpg" title="Foot Locker Ballerness" />
<img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14880_u1npsmglw7b9t6hmoqhu.jpg" title="Foot Locker The Rocket" />
<img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14887_9bblfhhvc0x66vebgjua.jpg" title="NCAA D2 Cro" />
<img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14884_mud4ewe6uh6ihrrpux6g.jpg" title="NXN Recap and Results" />
<img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14865_y1kt8vzejkvz25k075x2.jpg" title="Give Your " />
<img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14877_1mlnygbenofquj5h3mcz.jpg" title="NCAA D2 XC Champ" />
<img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14855_9g971maove1jyos0h9zk.jpg" title="Defending" />
<img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14850_6u22ylfzym7sxq1zw8p8.jpg" title="NXN 121" />
</div>
<div id="caption" style="float: left;">
</div>
</body>
</html>
Hi, I'm trying to figure out how to put up links on a rotating homepage banner. I've tried everything I could find through Googling, etc. and nothing seems to work. Is this because the coordinates for the banner links need to be set in Flash? I tried to set them in Flash but didn't have enough experience with the program. Is there a way I can put some custom code in for the links? Any help would be much appreciated. Thanks! Hi, I'm hoping this is a simple question but I'm such a beginner I need some help! I recently found a great little code that allows me to have rotating ads with links on my website. It works perfectly but I need to have four images rotating, not three and I can't work out how to do it. Can anyone help? Thanks! Code: <html>
<head>
<title>Essex Mums Header</title>
<script language="JavaScript">
if (document.images) {
ads = new Array(3);
ads[0] = "http://www.christmastoylist.co.uk/christmas1.jpg" ;
ads[1] = "http://www.essexmums.org/images/derekanson.jpg";
ads[2] = "http://www.essexmums.org/images/littleones.jpg";
ads[3] = "http://www.essexmums.org/images/ingrave.jpg";
ads2 = new Array(3);
ads2[0]="http://www.essexmums.org/images/letsplayfair1.jpg";
ads2[1]="http://www.essexmums.org/images/letsplayfair2.jpg";
ads2[2]="http://www.essexmums.org/images/letsplayfair3.jpg";
ads2[3]="http://www.essexmums.org/images/letsplayfair4.jpg";
}
newplace = new Array(3);
newplace[0] = "http://www.christmastoylist.co.uk/"
newplace[1] = "http://www.derekanson.com"
newplace[2] = "http://www.littleonesclothing.co.uk/"
newplace[3] = "http://www.ingravecommunitymarket.blogspot.com/
otherplace = new Array(3);
otherplace[0] = "http://www.letsplayfair.co.uk"
otherplace[1] = "http://www.letsplayfair.co.uk"
otherplace[2] = "http://www.letsplayfair.co.uk"
otherplace[3] = "http://www.letsplayfair.co.uk"
var timer = null
var counter = 0
function banner() {
timer=setTimeout("banner()", 8000);
counter++;
if (counter >= 3)
counter = 0;
document.bannerad.src = ads[counter];
document.bannerad2.src = ads2[counter];
}
function left() {
counter2 = counter;
window.location.href = newplace[counter2];
}
function right() {
counter2 = counter;
window.location.href = otherplace[counter2];
}
</script>
</head>
<body
style="margin: auto; width: 1024px; display: block; font-family: Myriad Web Pro;"
onload="banner()">
<div>
<table style="text-align: center; width: 1024px; height: 176px;"
class="header" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr style="background-color: rgb(232, 248, 255);">
<td style="vertical-align: top; width: 200px; text-align: center;">
<div
style="border-style: solid; border-width: 1px; margin: 20px 5px 5px; width: 190px; height: 160px;"><a
href="javascript:left()" rel="nofollow"><img
src="http://www.christmastoylist.co.uk/christmas1.jpg" name="bannerad"
border="0" height="160" width="190"></a> </div>
</td>
<td style="vertical-align: top; width: 615px; height: 172px;">
<div style="margin-top: 20px;"><a href="http://www.essexmums.org"><img
style="border: 0px solid ; width: 615px; height: 172px; margin-bottom: 20px;"
alt="" src="http://www.essexmums.org/images/banner.jpg" hspace="5"></a></div>
</td>
<td style="vertical-align: top; width: 200px; text-align: center;">
<div
style="border-style: solid; border-width: 1px; margin: 20px 5px 5px; width: 190px; height: 160px;"><a
href="javascript:right()"><img
src="http://www.essexmums.org/images/letsplayfair1.jpg"
name="bannerad2" border="0" height="160" width="190"></a> </div>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Hello, I need the links to the rotating images to open in a new window. Is there an easy way to do this? Here is my code: [CODE] <script type="text/javascript"> var preload_ctrl_images=true; //And configure the image buttons' images he var previmg='left.gif'; var stopimg='stop.gif'; var playimg='play.gif'; var nextimg='right.gif'; var slides=[]; //FIRST SLIDESHOW //configure the below images and descriptions to your own. slides[0] = ["/pics/nav/home2/music-club_manatella.jpg", "", "/progs/main/manatella.pdf"]; slides[1] = ["/pics/nav/home2/teen-read-week2011.jpg", "", "/teens/teen-read-week2011.pdf"]; slides[2] = ["/pics/nav/home2/oceanway-express.jpg", "", "/lib/branches/OWY.html"]; slides[3] = ["/pics/nav/home2/jea-green.jpg", "", "/progs/jpl/home-energy-evaluation.html"]; slides[4] = ["/pics/nav/home2/childrens-summer-reading.jpg", "", "/kids/kids-summer-reading2011.pdf"]; slides[5] = ["/pics/nav/home2/teen-summer-reading.jpg", "", "/teens/teens-summer-reading2011.pdf"]; slides[6] = ["/pics/nav/home2/internet-safety.jpg", "", "/Training/Internet-Safety/internet-safety.html"]; slides.no_descriptions=1; //use for no descriptions displayed //use for no descriptions displayed //above slide show uses only the defaults </script> <script src="http://jpl.coj.net/common/javascripts/swissarmy.js" type="text/javascript"> </script> [CODE] [URL]http://jpl.coj.net Thank you so much for your help, Elbee Hello, I use the following script for my rotating images with links and would like to know if there is a way to have the links display in a new window: Code: <script type="text/javascript"> var preload_ctrl_images=true; //And configure the image buttons' images he var previmg='left.gif'; var stopimg='stop.gif'; var playimg='play.gif'; var nextimg='right.gif'; var slides=[]; //FIRST SLIDESHOW //configure the below images and descriptions to your own. slides[0] = ["http://jpl.coj.net/pics/nav/home2/beaches-anniversary.jpg", "", "http://jaxpubliclibrary.org/progs/jb/25th-anniversary.pdf"]; slides[1] = ["http://jpl.coj.net/pics/nav/home2/young-author-visit.jpg", "", "http://jaxpubliclibrary.org/progs/mh/writers-express.pdf"]; slides[2] = ["http://jpl.coj.net/pics/nav/home2/jea-green.jpg", "", "http://jaxpubliclibrary.org/progs/jpl/home-energy-evaluation.html"]; slides[3] = ["http://jpl.coj.net/pics/nav/home2/tropic-cancer.jpg", "", "http://jaxpubliclibrary.org/progs/main/tropic-cancer.pdf"]; slides[4] = ["http://jpl.coj.net/pics/nav/home2/childrens-summer-reading.jpg", "", "http://jpl.coj.net/kids/kids-summer-reading2011.pdf"]; slides[5] = ["http://jpl.coj.net/pics/nav/home2/teen-summer-reading.jpg", "", "http://jpl.coj.net/teens/teens-summer-reading2011.pdf"]; slides[6] = ["http://jpl.coj.net/pics/nav/home2/harry-potter.jpg", "", "http://jpl.coj.net/progs/jpl/harry-potter-programs.pdf"]; slides[7] = ["http://jpl.coj.net/pics/nav/home2/internet-safety.jpg", "", "http://jaxpubliclibrary.org/Training/Internet-Safety/internet-safety.html"]; slides[8] = ["http://jpl.coj.net/pics/nav/home2/zines-art-walk.jpg", "", "http://jaxpubliclibrary.org/progs/main/zine-month.pdf"]; slides.no_descriptions=1; //use for no descriptions displayed //use for no descriptions displayed //above slide show uses only the defaults </script> <script src="http://jpl.coj.net/common/javascripts/swissarmy.js" type="text/javascript"> </script> Thanks for your help, Elbee I have a javascript function that changes the src and href of an image within a repeating function. If i call document.getelementbyid("image").src, i can change the image and by calling document.getelementbyid("image").Href, i am able to change the link. The problem i have now is that when the cursor goes over the image it gets the link location as a snapshot. If i leave my cursor and the image and link location changes, it does not update the snapshot and if i click on the new image it uses the previous link rather than the new one. The only way to get the new link is to move off the image and back on to get a new snapshot of the new link. Is there a way i can tell the javascript to change the image, link location and update the browser to the new link without moving the cursor.
I'm having major pains trying to figure this out. I'm kind of new to Javascript, I need to open a text file from an external server, store each line in an array, then search that array for a certain word (HIGH), and if it exists then write something to the webpage, and if not, write something else. Here is what I have so far: Code: <html>
<head>
<title>Test</title>
<script>
<!--
function test(x) {
if (wxd1txt.readyState === 4 && wxd1txt.status === 200) { // Makes sure the document is ready to parse and Makes sure it's found the file.
var wxd1text = wxd1txt.responseText;
var wxd1array = wxd1txt.responseText.split("\n"); // Will separate each line into an array
var wxd1high = wxd1array.toString(); //Converting the String content to String
//var highsearchreg = new RegExp("HIGH");
//var wxd1high = wxd1array[x].search(highsearchreg);
document.write(wxd1high);
if (wxd1high.search("HIGH") >= 0){
document.write("HIGH RISK");}
else {
document.write("NO RISK");}
}
}
//-->
</script>
</head>
<body>
Hi!
<script>
<!--
var Today = new Date();
var ThisDay = Today.getDate();
var ThisMonth = Today.getMonth()+1;
var ThisYear = Today.getYear();
var Hour = Today.getHours();
var Day2 = Today.getDate()+1;
var Day3 = Today.getDate()+2;
if (navigator.appName != "Microsoft Internet Explorer") {
ThisYear = ThisYear + 1900;}
if (ThisMonth < 10) {
ThisMonth = "0" + ThisMonth;}
if (ThisDay < 10) {
ThisDay = "0" + ThisDay;}
if (Hour == 2 || Hour == 22 || Hour == 23 || Hour == 0 || Hour == 1) {
var wxHourd1 = 0600}
else if (Hour >= 3 && Hour <= 10) {
var wxHourd1 = 1300;}
else if (Hour >= 11 && Hour <= 13) {
var wxHourd1 = 1630;}
else if (Hour >= 14 && Hour <= 16) {
var wxHourd1 = 2000;}
else if (Hour >= 17 && Hour <= 21) {
var wxHourd1 = 0100;}
//var wxurld1 = "http://www.spc.noaa.gov/products/outlook/archive/"+ThisYear+"/KWNSPTSDY1_"+ThisYear+""+ThisMonth+""+ThisDay+""+wxHourd1+".txt";
var wxurld1 = "http://www.spc.noaa.gov/products/outlook/archive/2010/KWNSPTSDY1_201005101300.txt" //(High risk day for testing)
//document.write(wxurld1); //Use this to verify this section is working
if (window.XMLHttpRequest)
{
wxd1txt=new XMLHttpRequest();
}
else // IE 5/6
{
wxd1txt=new ActiveXObject("Microsoft.XMLHTTP");
}
wxd1txt.open("GET", wxurld1, true);
wxd1txt.onreadystatechange = test();
// -->
</script>
</body>
</html>
When added to a webpage, nothing shows up except the "Hi!" and there are no errors in the Javascript Console in Google Chrome. Is this possible with Javascript, and if so, what am I doing wrong or not doing? Also, I have 2 URLs, one is a text file that has the HIGH text I want for an example, the other is the current file, which shouldn't have HIGH in it (unless the weather in the US turns really bad) Hello, I am trying to connect images to some anchor tags, but each anchor matches a specific image. The aim is that when someone clicks on a certain link it will display an image (which is some text information). I have some code from a previous thread which I gained a really good script from the help. I'm not sure how to connect these anchors to the specific image. I'm sure this code only needs tweaking slightly to give me what I need. Here is the code relevant to my issue: HTML: Code: <div id="faqBox"> <h1 id="faqHeader"><u>F.A.Q's</u></h1> <ul> <li><a href="#" onclick="">What is the purpose of this website?</a></li> <li><a href="#">What type of achievements would someone of had to do to be eligable?</a></li> <li><a href="#">Why was this award created?</a></li> <li><a href="#">How do we nominate somebody?</a></li> <li><a href="#">How are people presented with this award?</a></li> </ul> </div> <div id="faqInfoBox"> <img src="images/content1.png" name="allimage" id="allimage" alt="content1" border="0" /> </div> CSS: Code: #faqInfoBox {width: 40%;
border: 5px ridge;
height: 310px;
background: #606626;
float: right;
margin-right: 3%;}
#faqBox ul li{font-family: trebuchet ms;
line-height: 30px;
list-style-type: square;}
JS: Code: var imgArray = new Array(4);
imgArray[0] = 'images/content1.png';
imgArray[1] = 'images/content2.png';
imgArray[2] = 'images/content3.png';
imgArray[3] = 'images/content4.png';
imgArray[4] = 'images/content5.png';
var currIndex = 0;
function imgChange(that)
{
if(currIndex < myImages.length - 1) {
that.src = myImages[++currIndex];
}else {
currIndex = 0;
that.src = myImages[currIndex];
}
}
The JavaScript is what needs tweaking. I also have it uploaded to my free domain which you can find the site he http://abjava.host22.com/Site1/ if you would care to take a look. I don't want to be fed the answer but just some pointers/tips on what I could do. I was thinking of connecting the function to the anchor tags onclick event. But because I need the specific images to display when their relative link is clicked I know it could be harder to do this. I want to stack the images on top of each other and hide their display then when a link is clicked show it, when another is clicked, hide the first and show that one. (Please note,the last 4 images have not yet been created). I can figure out to do the CSS for this so just any help on the JS side will be very helpful to me. Thank you very much in advance if anyone can help. Regards, LC. Hi guys. I'm using a jquery plugin called innerfade, which I got from he http://medienfreunde.com/lab/innerfade/ . I've used it to fade few lines of text into each other: Code: <div class="fade"> <p>Line 1 asdfghjkl</p> <p>Line 2 sdasdsafasdgedgr</p> <p>Line 3 ddddddddddddddddddddd</p> </div> So only first line appears on page load, then after few seconds fades into Line 2 etc. Everything works perfect, but there is only one problem - the text is not centered even if it says so in CSS. Since the lines have different lenghts, the shorter the line the more it's aligned to the left. I've added properties for both div and p's - tried all combinations of text-align: center and margin left & right: auto. No joy. But when I remove the script all 3 lines appear centered perfectly. So my question is how do I make them centered? I presume it has to be added in the JS part since it seems to be overriding the CSS. Here is the script's full code: Code: (function($) {
$.fn.innerfade = function(options) {
return this.each(function() {
$.innerfade(this, options);
});
};
$.innerfade = function(container, options) {
var settings = {
'animationtype': 'fade',
'speed': 'normal',
'type': 'sequence',
'timeout': 2000,
'containerheight': 'auto',
'runningclass': 'innerfade',
'children': null
};
if (options)
$.extend(settings, options);
if (settings.children === null)
var elements = $(container).children();
else
var elements = $(container).children(settings.children);
if (elements.length > 1) {
$(container).css('position', 'relative').css('height', settings.containerheight).addClass(settings.runningclass);
for (var i = 0; i < elements.length; i++) {
$(elements[i]).css('z-index', String(elements.length-i)).css('position', 'absolute').hide();
};
if (settings.type == "sequence") {
setTimeout(function() {
$.innerfade.next(elements, settings, 1, 0);
}, settings.timeout);
$(elements[0]).show();
} else if (settings.type == "random") {
var last = Math.floor ( Math.random () * ( elements.length ) );
setTimeout(function() {
do {
current = Math.floor ( Math.random ( ) * ( elements.length ) );
} while (last == current );
$.innerfade.next(elements, settings, current, last);
}, settings.timeout);
$(elements[last]).show();
} else if ( settings.type == 'random_start' ) {
settings.type = 'sequence';
var current = Math.floor ( Math.random () * ( elements.length ) );
setTimeout(function(){
$.innerfade.next(elements, settings, (current + 1) % elements.length, current);
}, settings.timeout);
$(elements[current]).show();
} else {
alert('Innerfade-Type must either be \'sequence\', \'random\' or \'random_start\'');
}
}
};
$.innerfade.next = function(elements, settings, current, last) {
if (settings.animationtype == 'slide') {
$(elements[last]).slideUp(settings.speed);
$(elements[current]).slideDown(settings.speed);
} else if (settings.animationtype == 'fade') {
$(elements[last]).fadeOut(settings.speed);
$(elements[current]).fadeIn(settings.speed, function() {
removeFilter($(this)[0]);
});
} else
alert('Innerfade-animationtype must either be \'slide\' or \'fade\'');
if (settings.type == "sequence") {
if ((current + 1) < elements.length) {
current = current + 1;
last = current - 1;
} else {
current = 0;
last = elements.length - 1;
}
} else if (settings.type == "random") {
last = current;
while (current == last)
current = Math.floor(Math.random() * elements.length);
} else
alert('Innerfade-Type must either be \'sequence\', \'random\' or \'random_start\'');
setTimeout((function() {
$.innerfade.next(elements, settings, current, last);
}), settings.timeout);
};
})(jQuery);
// **** remove Opacity-Filter in ie ****
function removeFilter(element) {
if(element.style.removeAttribute){
element.style.removeAttribute('filter');
}
}
And call: Code: $(document).ready(
function(){
$('.fade').innerfade({
animationtype: 'fade',
speed: 750,
timeout: 5000,
type: 'random',
containerheight: '1em'
});
});
Hey all. I'm looking for a way to have a single, random line fetched from multiple text files, and then have that combination output somewhere, whether just to some field or another text file. For example: Text file A - I like I hate I love I despise I cherish Text file B - apples bananas oranges grapes grapefruit pineapple cherries Text file C - some of the time. most of the time. a lot of the time. pretty much never. So it would go in, get a line from each, and display something like: I love - grapefruit - most of the time. I cherish - pineapple - some of the time. etc. etc. I know it's a weird-sounding example, but you get the point. The line choices don't have to be separated by hyphens, but they preferably would be separated by something, like a comma, semi-colon, slash, whatever. I know this is pretty much a web coding forum, so that would be fine if I had to host it on my server or open it with a browser. But it would be optimal if this could be made into a standalone executable. I'm basically looking for something like Random Line Picker, just with the added functionality I mentioned. I'd be willing to make a little donation to someone if coding this would be a little difficult. Thanks! Okay, I have this code, Code: <script type="text/javascript">
function changeText2(){
var userInput = document.getElementById('userInput').value;
document.getElementById('boldStuff2').innerHTML = userInput;
}
</script>
<p>Welcome to the site <b id='boldStuff2'>dude</b> </p>
<input type='text' id='userInput' value='Enter Text Here' />
<input type='button' onclick='changeText2()' value='Change Text'/>
A fairly simple one, and it is great, but I want to change it so that the text you type in stays there! Forever! For example, a person visits the site and types in "Hello" then the option of changing the text again disappears, and every visitor after that sees "Hello" (or whatever the first person types). Is this possible? Can anyone help me out! I am trying to change text in one cell of a table when a user selects an item from a select menu. The data for the select menu is being pulled from a database (which works fine). The select menu is displayed as expected; however the text in the div tag always comes up as "undefined" The code below is part of a PHP script (thus \" instead of ") I would like to employ a method that does not require extra Javascript in the <head> section as in this instance the code is being output from an include that is called long after the <head> area of the document is processed. Here is what I have Code: <tr><td><select name=\"race\" onchange=\"document.getElementById('ExtraInfo').firstChild.nodeValue = this.options[this.selectedIndex].extrainfo\">
<option selected=\"selected\" value=\"\">Select Race</option>\n";
$sql = mysql_query("SELECT * FROM races");$i=1;
while ($row = mysql_fetch_array($sql)){
$output .= "<option value=\"$i\" ExtraInfo=\"{$row['des']}\">{$row['race']}</option>\n";
$i++;
}
$output .= "</select></td>
<td><div id=\"ExtraInfo\">Select Race</div></td></tr>
Any help will be greatly appreciated. I found a solution to my problem: by replacing: Code: <select name=\"race\" onchange=\"document.getElementById('ExtraInfo').firstChild.nodeValue = this.options[this.selectedIndex].extrainfo\">
with this: Code: <select name=\"race\" onchange=\"document.getElementById('ExtraInfo').firstChild.nodeValue = this.options[this.selectedIndex].getAttribute('extrainfo')\">
Hello, I'm learning javascript and made this little program that takes the price, qty, adds tax and gives you a total. I put in an if statement so that if qty is 0, it becomes 1 then does the calcs. However, if I put in say price 5 and qty 2, qty is changing to false and it doesn't calc. Here it is: http://heresmary.com/test/Bought.html I'm taking a JavaScript class in school and we are working with forms and summary pages. We were never taught how to change the font color and bgColor when we go to the summary page after an onSubmit. Can anyone fill me in on how it is done?
I'm building a template editor and need some help changing some of the variables. Part 1. Only at DEALERNAME. Must present coupon at time of write-up. Cannot be combined with any other offer. 1 coupon per customer per transaction. Expires: 00/00/00.s I need to be able to fill out two fields to change DEALERNAME and 00/00/00. I found a way to do this but it required the output to be in a field. I need it the output to look no different than before. Part 2. I'm using this to change some text via radio button but I would like an option to select how many details are there is the first place. Say they only want 1 or 2 details and not 3. Head Code: <script language="javascript" type="text/javascript">
function detail1a(){
document.getElementById("detail1").innerHTML = "Up to 5 Quarts";
}
function detail1b(){
document.getElementById("detail1").innerHTML = "Synthetic Oil Extra";
}
function detail1c(){
document.getElementById("detail1").innerHTML = "Lube Chassis";
}
function detail2a(){
document.getElementById("detail2").innerHTML = "Up to 5 Quarts";
}
function detail2b(){
document.getElementById("detail2").innerHTML = "Synthetic Oil Extra";
}
function detail2c(){
document.getElementById("detail2").innerHTML = "Lube Chassis";
}
function detail3a(){
document.getElementById("detail3").innerHTML = "Up to 5 Quarts";
}
function detail3b(){
document.getElementById("detail3").innerHTML = "Synthetic Oil Extra";
}
function detail3c(){
document.getElementById("detail3").innerHTML = "Lube Chassis";
}
</script>
Body Code: <span style="font-weight: bold;">Offer Details</span><br /> <p style="margin: 8px 10px"> Detail 1<br /> <input type="radio" name="on/off" onclick="detail1a();" />Up to 5 quarts<br /> <input type="radio" name="on/off" onclick="detail1b();" />Synthetic Oil Extra<br /> <input type="radio" name="on/off" onclick="detail1c();" />Lube Chassis<br /> </p> <p style="margin: 8px 10px"> Detail 2<br /> <input type="radio" name="on/off" onclick="detail2a();" />Up to 5 quarts<br /> <input type="radio" name="on/off" onclick="detail2b();" />Synthetic Oil Extra<br /> <input type="radio" name="on/off" onclick="detail2c();" />Lube Chassis<br /> </p> <p style="margin: 8px 10px"> Detail 3<br /> <input type="radio" name="on/off" onclick="detail3a();" />Up to 5 quarts<br /> <input type="radio" name="on/off" onclick="detail3b();" />Synthetic Oil Extra<br /> <input type="radio" name="on/off" onclick="detail3c();" />Lube Chassis<br /> </p> Output Code: <ul> <li><span id="detail1">Detail 1</span></li> <li><span id="detail2">Detail 2</span></li> <li><span id="detail3">Detail 3</span></li> </ul> Hi, am newbie in this domain ,so i appreciate any help of you. Am making a site for tattoos and i see somewhere an application in Java for changing text, it was simple text box where you write the text you want and down you choose the Font and down you have the text you want in the wanted fond. Thank you!
I currently have an image and underneath it there are 6 thumbnails. When I run the cursor over them the big image changes. This works fine. However, I would like to have text beside the big picture that also changes depending on the thumbnail over which I am hovering. I have tried to work it out myself but failed miserably. I have tried forums, but can't find what I need. My code as it stands at the moment is: <script type="text/javascript"> if (document.images) {image0 = new Image; image0.src = "i/p0.png"; image1 = new Image; image1.src = "i/p1.png"; image2 = new Image; image2.src = "i/p2.png"; image3 = new Image; image3.src = "i/p3.png"; image4 = new Image; image4.src = "i/p4.png"; image5 = new Image; image5.src = "i/p5.png"; image6 = new Image; image6.src = "i/p6.png"; }</script> and <img class="img" src="i/p0.png" align="left" width="300" name="rollimg" title='blah' alt="blah"/> <span class="inverse-text"><this is where I want changing text to appear as I roll over thumbnails.</span> <br clear="all"/> <span onmouseover="document.rollimg.src=image0.src;"><img src="i/tb/t0.jpg" class="img" width="70" alt="blah" title="blah"/></span> <span onmouseover="document.rollimg.src=image1.src;"><img src="i/tb/t1.gif" class="img" width="70" alt="blah" title="blah"/></span> <span onmouseover="document.rollimg.src=image2.src;"><img src="i/tb/t2.gif" class="img" width="70" alt="blah" title="blah"/></span> <span onmouseover="document.rollimg.src=image3.src;"><img src="i/tb/t3.gif" class="img" width="70" alt="blah" title="blah"/></span> <span onmouseover="document.rollimg.src=image4.src;"><img src="i/tb/t4.gif" class="img" width="70" alt="blah" title="blah"/> <span onmouseover="document.rollimg.src=image5.src;"><img src="i/tb/t5.gif" class="img" width="70" alt="blah" title="blah"/> <span onmouseover="document.rollimg.src=image6.src;"><img src="i/tb/t6.gif" class="img" width="70" alt="blah" title="blah"/> Ideally if you could tell me how to update the above script and code, so that it works, I would be very grateful. Is it possible to dynamically change the value of text on a page as the user types into a text box? E.g. like: You Are Typing: <script> var keyword = document.getElementById('string'); document.write(keyword); </script> Or I could probably insert it into a function and loop it over and over again or is there a better way? I am looking for an input text that links to a iframe. . ? To begin, we need some simple HTML elements: A basic form; An Input text that will contain the URLs we want to use; An iFrame that will display the page we select from the input text. Thanks in advance Stickers |
|||||||