|
JavaScript - Pictures No Showing Up In My Javascript Banner
HI so sorry to bother you with what seems to be a simple problem i am just getting back into my coding and i can not see what i am doing wrong. i have my folder with index page in named "tester_fixed.html" and then a folder for images where i have place header1 header 2 and header 3 . i downloaded a script from http://www.javascriptkit.com/script/...bleslide.shtml
and edited my images in and i think i mucked up as they are not showing. please could you tell me what i am doing wrong and point me in the right direction. Many thanks Bec the code: Code: <script type="text/javascript">
// Flexible Image Slideshow- By JavaScriptKit.com (http://www.javascriptkit.com)
// For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/
// This notice must stay intact for use
var ultimateshow=new Array()
//ultimateshow[x]=["path to image", "OPTIONAL link for image", "OPTIONAL link target"]
ultimateshow[0]=['images/header1.jpeg', '', '']
ultimateshow[1]=['images/header2.jpeg', 'http://www.dynamicdrive.com', '_new']
ultimateshow[2]=['images/header3.jpeg', 'http://www.codingforums.com', '']
//configure the below 3 variables to set the dimension/background color of the slideshow
var slidewidth="240px" //set to width of LARGEST image in your slideshow
var slideheight="940px" //set to height of LARGEST iamge in your slideshow
var slidecycles="3" //number of cycles before slideshow stops (ie: "2" or "continous")
var randomorder="no" //randomize the order in which images are displayed? "yes" or "no"
var preloadimages="yes" //preload images? "yes" or "no"
var slidebgcolor='white'
//configure the below variable to determine the delay between image rotations (in miliseconds)
var slidedelay=3000
////Do not edit pass this line////////////////
var ie=document.all
var dom=document.getElementById
var curcycle=0
if (preloadimages=="yes"){
for (i=0;i<ultimateshow.length;i++){
var cacheimage=new Image()
cacheimage.src=ultimateshow[i][0]
}
}
var currentslide=0
function randomize(targetarray){
ultimateshowCopy=new Array()
var the_one
var z=0
while (z<targetarray.length){
the_one=Math.floor(Math.random()*targetarray.length)
if (targetarray[the_one]!="_selected!"){
ultimateshowCopy[z]=targetarray[the_one]
targetarray[the_one]="_selected!"
z++
}
}
}
if (randomorder=="yes")
randomize(ultimateshow)
else
ultimateshowCopy=ultimateshow
function rotateimages(){
curcycle=(currentslide==0)? curcycle+1 : curcycle
ultcontainer='<center>'
if (ultimateshowCopy[currentslide][1]!="")
ultcontainer+='<a href="'+ultimateshowCopy[currentslide][1]+'" target="'+ultimateshowCopy[currentslide][2]+'">'
ultcontainer+='<img src="'+ultimateshowCopy[currentslide][0]+'" border="0">'
if (ultimateshowCopy[currentslide][1]!="")
ultcontainer+='</a>'
ultcontainer+='</center>'
if (ie||dom)
crossrotateobj.innerHTML=ultcontainer
if (currentslide==ultimateshow.length-1) currentslide=0
else currentslide++
if (curcycle==parseInt(slidecycles) && currentslide==0)
return
setTimeout("rotateimages()",slidedelay)
}
if (ie||dom)
document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>')
function start_slider(){
crossrotateobj=dom? document.getElementById("slidedom") : document.all.slidedom
rotateimages()
}
if (ie||dom)
window.onload=start_slider
</script>
<p style="font: normal 11px Arial">This free script provided by<br />
<a href="http://www.javascriptkit.com">JavaScript Kit</a></p>
thanks Similar TutorialsI have a javascript banner on my site which is working perfectly. however if the user goes to my domain without www. infront of the address the banner is non existent. I'm pretty sure there should be some kind of option for this on my hosts control panel but I can't find anything on it however. (bluehost) or is there something else that must be done? Thanks for any help. All, I have a PHP script that will get images out of the database and display them in a grid. I have two verisons. I save a thumbnail which I display and then a larger image in a different folder. These images are placed in a scroll bar but what I would like to happen is that when I click on a thumbnail it basically displays the bigger image until I click on that image and it goes away. I would love for the middle of the image to be displayed in the middle of the users screen but beggers probably can't be choosers in this case. An example of a similar desired result is a link he http://qrayg.com/experiment/hig/ Instead of the hover, I'd like to utilize the onclick to display and remove the image. If it's easy to put the center in the center of the screen that that would be absolutely incredible as well. Thanks for any guidance you could provide me on this. Thanks in advance! Hi guys. I have been scowering high and low for code to create a Java drop down menu bar for my site. I want it to be something like this: http://javascript-array.com/scripts/...rop_down_menu/ but want to insert pictures into it, for each heading, to create a new looking bar if thats possible. Can you do a mouseover with them also, as i currently have one set up, to change text colour (2 different images per button) but am unsure of the code. Thanks in advance. Hi I am trying to include an animated banner on my website but it wont work is there anyone out there who can look at my code and tell me where I am going wrong? Code:
<head>
<title>Online movie store</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" language="JavaScript" src="mylibrary.js">
</script>
<script type="text/javascript" language="JavaScript">
<!--
var myproducts = new Array("sherlockholmes","anchorman","weweresoldiers","starshiproopers","homealone","gamer","residentevil");
var itemqty = 0;
function showCookies(){
for (i=0;i<myproducts.length;i++){
var qtyWanted = GetCookie(myproducts[i]);
itemqty = qtyWanted ? qtyWanted : "0";
document.dvdform[myproducts[i]+"qty"].value = itemqty;
}
}
function addToCart(dvd){
itemqty = document.dvdform[dvd + "qty"].value;
itemqty = parseInt(itemqty);
SetCookie(dvd,itemqty);
var feedback = "An order for " + itemqty + " dvd(s) of ";
feedback += dvd.toUpperCase();
feedback += " has been added to your shopping cart.";
feedback += " Please click 'Check Out' when finished."
alert(feedback);
}
function checkOut(){
window.location.href = "return.html";
}
var myAds = new Array();
myAds[1] = new Image();
myAds[2] = new Image();
myAds[3] = new Image();
myAds[4] = new Image();
myAds[1].src = "images/sh.jpg";
myAds[2].src = "images/am.jpg";
myAds[3].src = "images/sold.jpg";
myAds[4].src = "images/star.jpg";
/* Callout: The timings represent the number of milliseconds delay between the images.*/
var myTimings = new Array();
myTimings[1] = 3000;
myTimings[2] = 1500;
myTimings[3] = 1500;
myTimings[4] = 1500;
var mySites = new Array();
mySites[1] = "sh.html";
mySites[2] = "am.html";
mySites[3] = "sold.html";
mySites[4] = "star.html";
var adnumber = 0;
var totalads = myAds.length - 1;
var timerID = "";
function startBanner(){
adnumber = 0;
showAd();
}
function showAd(){
if (document.images){
/*Callout: This condition ensures that each image loads
completely before the next image appears in the sequence. */
if (document.myBanner.complete){
adnumber++;
(adnumber > totalads) ? adnumber=1 : adnumber=adnumber;
document.myBanner.src = myAds[adnumber].src;
}
timerID = setTimeout("showAd()",myTimings[adnumber]);
}
}
function goSite(){
clearTimeout(timerID);
window.location.href = mySites[adnumber];
}
//-->
</script>
</head>
<body onload="showCookies(); startBanner();">
<form name="dvdform">
<div id="wrapper">
<div id="inner">
<div id="header">
<h1><img src="images/logo.png" width="519" height="63" alt="Online Movie Store" /></h1>
<div id="nav">
<a href="account.html">your account</a> | <a href="cart.html">view cart</a>
</div><!-- end nav -->
<img src="images/movie.png" width="744" height="198" alt="Banner" /></a>
</div><!-- end header -->
<dl id="browse">
<dt>We Have All Your Favourite Movies</dt>
<div align="CENTER">
<a href="sh.html" onclick=
"goSite();return false;"><img src = "images/sh.jpg"
name="myBanner" width="180" height="400" border="0" alt="Sherlock Holmes"></a></div>
</dl>
<div id="body">
<div class="inner">
<div class="leftbox">
<h3>Sherlock Holmes (2009)</h3>
<img src="images/sh.jpg" width="80" height="100" alt="sherlock holmes" class="left" />
<p>Detective Sherlock Holmes and his stalwart partner Watson engage in a battle of wits and brawn with a nemesis whose plot is a threat
to all of England.</p>
<input type="TEXT" name="sherlockholmesqty" size="5" value="0"><br>
<p><b>Price:</b> �3.00 per night</p>
<p class="readmore"><input type="button" value="Add to Cart" onclick="addToCart('sherlockholmes');">
</p>
<div class="clear"></div>
</div><!-- end .leftbox -->
<div class="rightbox">
<h3>Anchorman: The legend of Ron Burgundy (2004)</h3>
<img src="images/am.jpg" width="80" height="100" alt="Anchorman" class="left" />
<p>Ron Burgundy is San Diego's top rated newsman in the male dominated broadcasting of the 1970's, but that's all about to change when a new
female employee with ambition to burn arrives in his office.</p>
<input type="TEXT" name="anchormanqty" size="5" value="0"><br>
<p><b>Price:</b> �3.00 per night</p>
<p class="readmore"><input type="button" value="Add to Cart" onclick="addToCart('anchorman');"></p>
<div class="clear"></div>
</div><!-- end .rightbox -->
<div class="clear br"></div>
<div class="leftbox">
<h3>We Were Soldiers (2002)</h3>
<img src="images/sold.jpg" width="80" height="100" alt="we were soldiers" class="left" />
<p>The story of the first major battle of the American phase of the Vietnam War and the soldiers on both sides that fought it.</p>
<p><b>Price:</b> �3.00 per night</p>
<input type="TEXT" name="weweresoldiersqty" size="5" value="0"><br>
<p class="readmore"><input type="button" value="Add to Cart" onclick="addToCart('weweresoldiers');">
</p>
<div class="clear"></div>
</div><!-- end .leftbox -->
<div class="rightbox">
<h3>Starship Troopers (1997)</h3>
<img src="images/star.jpg" width="80" height="100" alt="Starship troopers" class="left" />
<p>Humans of a fascistic, militaristic future do battle with giant alien bugs in a fight for survival.</p>
<p><b>Price:</b> �3.00 per night</p>
<input type="TEXT" name="starshiptroopersqty" size="5" value="0"><br>
<p class="readmore"><input type="button" value="Add to Cart" onclick="addToCart('starshiptroopers');"></p>
<div class="clear"></div>
</div><!-- end .rightbox -->
<div class="clear br"></div>
<div class="leftbox">
<h3>Home Alone (1990)</h3>
<img src="images/homealone.jpg" width="80" height="100" alt="Home Alone" class="left" />
<p>An 8-year-old boy, who is accidentally left behind while his family flies to France for Christmas, has to defend his home against idiotic burglars.</p>
<p><b>Price:</b> �3.00 per night</p>
<input type="TEXT" name="homealoneqty" size="5" value="0"><br>
<p class="readmore"><input type="button" value="Add to Cart" onclick="addToCart('homealone');">
</p>
<div class="clear"></div>
</div><!-- end .leftbox -->
<div class="rightbox">
<h3>Gamer (2009)</h3>
<img src="images/gamer.jpg" width="80" height="100" alt="Gamer" class="left" />
<p>In a future mind-controlling game, death row convicts are forced to battle in a 'doom'-type environment. Convict Kable, controlled by Simon,
a skilled teenage gamer, must survive 30 sessions in order to be set free. Or won't he?</p>
<p><b>Price:</b> �3.00 per night</p>
<input type="TEXT" name="gamerqty" size="5" value="0"><br>
<p class="readmore"><input type="button" value="Add to Cart" onclick="addToCart('gamer');">
</p>
<div class="clear"></div>
</div><!-- end .rightbox -->
<div class="clear"></div>
</div><!-- end .inner -->
</div><!-- end body -->
<div class="clear"></div>
<div id="footer">
<div id="footnav">
<a href="account.html">Your Account</a> | <a href="cart.html">View Cart</a>
</div><!-- end footnav -->
</div><!-- end footer -->
</div><!-- end inner -->
</div><!-- end wrapper -->
</form>
</body>
</html>
I think the problem is that I have 2 onload functions in the body tag *<body onload="showCookies(); startBanner();">* does anyone know how I can fix this? Also when I put the Javascript into external files they won't work! but when I included the show cookies file in the html it works does anyone know where I am going wrong? -edit - nevermind. mods plz delete.
I recently uploaded my site from locally to a remote host. After uploading I noticed my ad block detection system stopped working as well as my banner rotation script. First off, I used the banner rotation script shown demo'd he http://labs.beacon9.ca/bannerRotator/ Now if you look at the source of that page you can see how the javascript works by including the BannerRotator.js. On my website, I stuck the jQuery "module" in a folder called "simple" and went from that route. If you look on my site: http://www.flex-essentials.com you can see that on the home page there is a large grey box where the banner rotator script should be, but is not. I'm using this "ready" function by jquery to load some things: Code: $(document).ready(function($) {
bannerRotator('#bannerRotator', 500, 5000, true);
$('a[rel*=facebox]').facebox();
if ($("#advert").height() == "0" || $("#advert").css("display") == "none"){//enabled
$("#lolaa").css("display", "block");
$("#lolaa").css("height", "90px");
}
else if($("#advert").height() != "0" || $("#advert").css("display") != "none"){//disabled
$("#lolaa").css("height", "0");
$("#lolaa").css("display", "none");
}
if($("#BodyAd").height() == "0" || $("#BodyAd").css("display") == "none"){//enabled
$("#wtlt_cube").css("display", "block");
$("#wtlt_cube").css("height", "213px");
}
else if($("#BodyAd").height() != "0" || $("#BodyAd").css("display") != "none"){//disabled
$("#wtlt_cube").css("height", "0");
$("#wtlt_cube").css("display", "none");
}
});
But for some reason, the only javascript code that is working is the "facebox" module. Please help me figure out why this javascript isnt loading. Thanks! Hi, Im new to javascript and spent hours trying to find the answer to this, Im sure its quite simple.. Im trying to add js banners to my website but cannot for the life of me adjust the position (right left) and float to the code. Is there a way to do so in plain text editor without messing with the site CSS code? Here is the code: <script type="text/javascript" src="http://js.xxx.com/javascript.php?prefix=w7UWAcUfIi4MJGdq9P6W22Nd7ZgqdRLk&media=9804&campaign=1"> </script> thanks Hi all. Can someone tell me why I can select both HTML AND another radio button, but when I unselect, and select a # of 1 through 4, I can switch between the radio buttons, but I can't if I select HTML first? Also, what's wrong w/ this code? Code: <html>
<head>
<title>Webpage Teacher - V 1.0</title>
</head>
<body>
<script>
// set the radio button with the given value as being checked
// do nothing if there are no radio buttons
// if the given value does not exist, all the radio buttons
// are reset to unchecked
function setCheckedValue(radioObj, newValue) {
if(!radioObj)
return;
var radioLength = radioObj.length;
if(radioLength == undefined) {
radioObj.checked = (radioObj.value == newValue.toString());
return;
}
for(var i = 0; i < radioLength; i++) {
radioObj[i].checked = false;
if(radioObj[i].value == newValue.toString()) {
radioObj[i].checked = true;
}
}
}
function getCheckedValue(radioObj) {
if(!radioObj)
return "";
var radioLength = radioObj.length;
if(radioLength == undefined)
if(radioObj.checked)
return radioObj.value;
else
return "";
for(var i = 0; i < radioLength; i++) {
if(radioObj[i].checked) {
return radioObj[i].value;
}
}
return "";
}
</script>
<form name="radioExampleForm" method="get" action="">
<p>
<label for="code1"><input type="radio" value="HTML" name="code" id="code1"> HTML</label>
<label for="number0"><input type="radio" value="0" name="number" id="number0"> Zero</label>
<label for="number1"><input type="radio" value="1" name="number" id="number1"> One</label>
<label for="number2"><input type="radio" value="2" name="number" id="number2"> Two</label>
<label for="number3"><input type="radio" value="3" name="number" id="number3"> Three</label>
<label for="number4"><input type="radio" value="4" name="number" id="number4"> Four</label>
</p>
<p>
<script>
var thevar='';
if(document.forms['radioExampleForm'].elements['number']){
thevar='number';
}else{
thevar='code';
}
document.write(''
+'<input type="button" onclick="alert(\'Checked value is: '+getCheckedValue(document.forms[\'radioExampleForm\'].elements[\''+thevar+'\']));" value="Show Checked Value">');
</script>
<input type="button" onclick="setCheckedValue(document.forms['radioExampleForm'].elements['code'], 'HTML');" value="Set Checked to HTML">
<input type="button" onclick="setCheckedValue(document.forms['radioExampleForm'].elements['number'], '1');" value="Set Checked to One">
<input type="button" onclick="setCheckedValue(document.forms['radioExampleForm'].elements['number'], '2');" value="Set Checked to Two">
<input type="button" onclick="setCheckedValue(document.forms['radioExampleForm'].elements['number'], '3');" value="Set Checked to Three">
<input type="button" onclick="setCheckedValue(document.forms['radioExampleForm'].elements['number'], '4');" value="Set Checked to Four">
<input type="button" onclick="setCheckedValue(document.forms['radioExampleForm'].elements['number'], ''),setCheckedValue(document.forms['radioExampleForm'].elements['code'],'');" value="Uncheck All">
</p>
</form>
</body>
</html>
I simply want it to display the Check Value button and detect 2 different id's for 2 different radio buttons (which is 'code' and 'number') Thanks! Hi I'm making a php/html page and using javascript to keep a count for me. Code: <script type="text/javascript"> var i=0; }</script> . . . <form action="index.php" method="GET"> <input name="game_button" id="guess1" type = "submit" name="1" value="1" style="height: 50; width: 50; font-size: 16" onClick = "i=i+1;"/> </form> <input type="button" onClick = "alert(i);"/> The last button is just a test button, which will tell me what the value of "i" is, but I'm not getting anything when I cllick that button. However if I change the onClick from alert(i), to alert('i') it will alert me a string, so I know the javascript is working. Any ideas? Hello, I'm new to the forum. I tried coding this myself, but i'm just not that well versed in javascript and need a little help. I am trying to show certain div tags when you click on a hyperlink in an html document. I have four links (bio, news, portfolio, and resume) and four div tags (bio, news, portfolio, and resume). I am just going to show the code for one of the links. This is what I have for the bio link in the head of the html: Code:
function setVisible( setting )
{
var myElement = document.getElementById("bio");
if(setting)
myElement.style.visibility="visible";
else
myElement.style.visibility="hidden";
}
</script>
This is what I have in the style sheet: Code:
#bio {
position: absolute;
font: 9pt arial;
line-height: 10.5pt;
color: #fff;
width: 575px;
height: 300px;
margin-top: 390px;
margin-right: auto;
margin-left: 40px;
margin-bottom: 5px;
z-index: 1;
border: 0px solid #fff;
}
This is what I have on the link in the html doc (I'm assuming this is wrong, I don't know what the proper code should be): Code: <a href="javascript:onClick="setVisible(true)";">BIO</a> Does what I'm trying to do make sense? I'm assuming that it would be the same set up for all four links? Please let me know if I need to be more specific. Any help would GREATLY be appreciated! Thank you, Gerry Hello guys! I have a jquery fancybox that pop's up on exit (using onbeforeunload), now i want it to show only once so i tried doing it with cookies but i just can get it to work. this is my script so far hope you can help me with this, Thanks! Code: <script type="text/javascript">
function PopIt()
{
if (document.cookie.length == 0)
{
var exdate=new Date();
exdate.setDate(exdate.getDate()+7);
document.cookie="cook=yes" + ";expires="+exdate.toUTCString();
$("a#trigger").trigger('click');
window.onbeforeunload = UnPopIt;
return "Before you leave:\nPlease take a few seconds to answer 2 questions\nso we can better assist you and others in the future. \nThanks!";
}
}
function UnPopIt() { /* nothing to return */ }
$(document).ready(function() {
window.onbeforeunload = PopIt;
$("a#trigger").fancybox({
'hideOnContentClick': false,
'showCloseButton': true
});
$("a[id!=trigger]").click(function(){ window.onbeforeunload = UnPopIt; });
});
</script>
so i have to use the addEvent() to call the makeBannerAd function which i believe i have done so.... but then i gotta <div id = "bannerBox"> </div> and loop through all the iteams in my adsURL Array and for each item i must create the html fragment <div class = "bannerAd"> <a href = "url"> <img src = "bannerindex" /> </a> </div> i must set the z index number to each number ad to the value of the counter index and append the banner ad to the banner Box element.....Append the bannerBox to the documentbody, run the changeBannerAd() every 10 sec Banners.js Code: //this is the global scope here when you declare out side of a function it because global or at the top of the js file
var nextAd; //this is going to be used to change or show the next banner ad to the web page
function addEvent(object, evName, fnName, cap)
{
makeBannerAds();
if (object.attachEvent)
{
object.attachEvent("on" + evName, fnName);
}//end if
else if (object.addEventListener)
{
object.addEventListener(evName, fnName, cap);
}//end else if
}//end function addEvent
function makeBannerAds()
{
//this creates a banner box to store the banner ads in
var bannerBox = document.createElement("div");
bannerBox.id = "bannerBox";
for(var i = 0; i < document.adsURL.length; i++)
{
if(adsURL[i] != <div class = "bannerAd">,
<a href ="url">,
<img src ="bannerindex" />,
</a>,
</div>)
{
if
(adsURL[i] = <div class = "bannerAd">,
<a href ="url">,
<img src ="bannerindex" />,
</a>,
</div>)
else
return adsURL[i] = <div class = "bannerAd">,
<a href ="url">,
<img src ="bannerindex" />,
</a>,
</div>;
}//end if
}//end if
}//end function makeBannerAds
ads.js Code: function storeURL()
{
//this creates a new array, the array is called adsUR:
var adsURL = new Array();
//this stores each item in the array using a index place holder
adsURL[0] = "testpage0.htm";
adsURL[1] = "testpage1.htm";
adsURL[2] = "testpage2.htm";
adsURL[3] = "testpage3.htm";
adsURL[4] = "testpage4.htm";
adsURL[5] = "testpage5.htm";
adsURL[6] = "testpage6.htm";
adsURL[7] = "testpage7.htm";
adsURL[8] = "testpage8.htm";
adsURL[9] = "testpage9.htm";
adsURL[10] = "testpage10.htm";
adsURL[11] = "testpage11.htm";
}//end function storeURL
books.html file Code: <head>
<!--
-->
<title>Online Bookworms</title>
<link href="bw.css" rel="stylesheet" type="text/css" />
<link href="bannerstyles.css" rel="stylesheet" type="text/css" />
<script src ="ads.js" type ="text/javascript"></script> <!--calls the external file called slideshow.js -->
<script src ="banners.js" type ="text/javascript"></script> <!--calls the external file called slideshow.js -->
</head>
<body>
<div id="page">
<h1 id="heading"><img src="bwlogo.jpg" alt="Online Bookworms" /></h1>
<ul id="menu">
<li><a href="#">Home</a></li>
<li><a href="#">Reviews</a></li>
<li><a href="#">Forums</a></li>
<li><a href="#">Book Swaps</a></li>
<li><a href="#">OBW Store</a></li>
<li><a href="#">Author's Corner</a></li>
<li><a href="#">My Account</a></li>
</ul>
<ul id="menu2">
<li><a href="#">My Reading List</a></li>
<li><a href="#">Review a Book</a></li>
<li><a href="#">Join a Discussion</a></li>
<li><a href="#">Post to a Forum</a></li>
<li><a href="#">My Mail</a></li>
<li><a href="#">My Posts</a></li>
<li class="newgroup"><a href="#">Reading Recommendations</a></li>
<li><a href="#">Books of the Month</a></li>
<li class="newgroup"><a href="#">MP3 Downloads</a></li>
<li><a href="#">Podcast</a></li>
<li><a href="#">RSS Feeds</a></li>
<li class="newgroup"><a href="#">Tech Support</a></li>
<li><a href="#">Comments</a></li>
<li><a href="#">About online BookWorms</a></li>
</ul>
<div id="main">
<h2>Welcome</h2>
<p>Welcome to <strong>online BookWorms</strong> — your location on
the Web for books, magazines, short stories, poetry, and essays.
Please explore our online bookstore for the lowest prices on new
and rare books. Share your love of reading by joining one of our
many forums and discussion groups. Are you an aspiring critic?
We welcome book reviews and essays on your favorite authors and
works.
</p>
<h2>News</h2>
<p>We are very happy to introduce the <a href="#">online BookWorms
Podcast</a>. The podcast will contain free excerpts from great
works of fiction and reviews of current books. You can quickly
subscribe to this new BookWorms feature <a href="#">here</a>.
</p>
<p>Take a few moments now to explore our book shelves. And remember to
patronize our sponsors by clicking the banner ads at the top of the
page. Enjoy browsing our site!
<p id="signature">
<img src="signature.jpg" alt="Helen Ungerstatz" />
</p>
</div>
</div>
</body>
</html>
Hi there I've just completed a lovely slideshow script on my homepage. It works great in Firefox, but doesn't display at all in IE. It's on a live test page he http://www.modern-wedding-ideas.co.uk/index2.html I'm sure I'm just missing something really simple. Any help would be greatly appreciated. Also, this is a copy and paste job: I'm a newbie to javascript! So please be gentle. Many thanks Nicola Hya, I've been trying to get a marquee working for my site, and would like it to use an external file for the text that it scrolls. Currently nothing is showing up except for a little space where it should be that is only visible when I highlight the page by selecting edit>select all I have used the script avaliable here but instead of inserting the script into the body I have put it into an external .js my script is the same as theirs except I have made the links point to my documents instead of the samples they gave, however I will paste it here incase I have managed to delete one vital full stop or something. Code: <IE:Download ID="marqueedata" STYLE="behavior:url(#default#download)" />
<marquee id="externalmarquee" direction=up scrollAmount=4 style="width:200px;height:150px;border:1px solid black;padding:3px" onmouseover="this.scrollAmount=2" onmouseout="this.scrollAmount=4" src="News.htm">
</marquee>
<script language="Javascript1.2">
function downloaddata(){
marqueedata.startDownload(externalmarquee.src,displaydata)
}
function displaydata(data){
externalmarquee.innerHTML=data
}
if (document.all)
window.onload=downloaddata
</script>
<![endif]-->
I'm guessing it's because I have incorrectly moved the code from inside the HTML to the external .js. My website is avaliable here And the code I have used to insert this into the HTML (which I have a feeling is the problem) is as follows: Code: <div> <script type="text/javascript" src="/News.js"> </script> </div> Cheers, Al Hello everyone, I am trying to make a canvas element display an image with some text on using canvas.drawImage and canvas.fillText. Only problem is my code is generating a very odd and hard to debug error. Thanks in advance, Alex Code(JS): Code: function runstuff() {
canvasthing = document.getElementById('1');
context = canvasthing.getContext('2d');
purple = new Image();
purple.src = 'img/buttonpurple.png';
purple.onload = function() {
context.drawImage('purple', 0, 0);
};
context.font = '16px Vani';
context.textBaseline = 'top';
context.fillText('Test', 26, 24);
}
Code(html): Code: <!doctype html> <html lang="en"> <head> <title>POB.G</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link rel="stylesheet" type="text/css" href="style.css"> <script type="text/javascript" src="script.js"> </script> </head> <body onload="runstuff()"> <canvas id="1" width="127" height="128"></canvas> </body> </html> Error: Code: Error: uncaught exception: [Exception... "Could not convert JavaScript argument arg 0 [nsIDOMCanvasRenderingContext2D.drawImage]" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: file:///C:/Users/*BlahBlahBlah/script.js :: <TOP_LEVEL> :: line 7" data: no] Hi, Sorry for the (HELP!) addition in the title, but i'm just stumped here. I am trying to show and hide div layers when I click on a button in a flash movie. The flash movie is in it's own div and the content below is also in it's own div. Is there a way to call the function from flash so that content in another div is affected? The code to show and hid layers in html is working and is he Code: //visible layers
function $_(IDS) { return document.getElementById(IDS); }
function setVisible( IDS ) {
var obj;
var sel = $_('divContent').getElementsByTagName('div');
for (var i=0; i<sel.length; i++) {
obj = sel[i].id;
if (obj != IDS) { $_(obj).style.display = 'none'; }
else { $_(obj).style.display != 'block' ? $_(obj).style.display="block" : $_(obj).style.display="none"; }
}
}
window.onload = function() {
setVisible('BIO');
};
</script>
</head>
<body>
<div id="navigation">
<a href="#" onClick="setVisible('BIO'); return false;">Who I Am</a><span class="text4"> |</span>
<a href="#" onClick="setVisible('News'); return false;">What's New</a><span class="text4"> |</span>
<a href="#" onClick="setVisible('Portfolio'); return false;">Portfolio</a><span class="text4"> |</span>
<a href="#" onClick="setVisible('Resume'); return false;">Resume</a>
</div>
<div id="divContent">
<div id="BIO" class='divElem'>
<p>This is my content for bio</p>
</div>
<div id="News" class='divElem'>
<pThis is my content for news</p>
</div>
<div id="Portfolio" class='divElem'>
<p><This is my content for portfolio </p>
</div>
<div id="Resume" class='divElem'>
<p>This is my content for resume</p>
</div>
</div>
</body>
Is there a way to call the function in flash on a button? Any help you can give would be GREATLY appreciated. Thanks and forever indebted. Gerry All, I have the following code: Code:
<div class="col-1">
<div id="swap">
<img src="images/gallery-img3-big.jpg" alt="" />
</div>
</div>
<div class="col-2">
<div class="list3">
<ul>
<li><a href="#"><img src="images/gallery-img1.jpg" alt="" /></a></li>
<li><a href="#"><img src="images/gallery-img2.jpg" alt="" /></a></li>
<li><a href="#"><img src="images/gallery-img3.jpg" alt="" /></a></li>
</ul>
</div>
</div>
When you click on any of the links with the <li> I'd like to put the image that was clicked in the <div id="swap"></div>. So I'm thinking this would have to be done with innerHTML and maybe pass a function the img src of the link that I would click on. Just not sure how to do that though. Any help would be greatly appreciated. Thanks in advance. I am using a jquery gallery slideshow on my homepage and I am having an issue where the images loaded before the dom is loaded causing the images to display in an ugly stack. I combated this a bit by setting a height on the div and setting the overflow to hidden. however you can still see the unstyled stack of images within the small div for a couple of seconds before the page is loaded. the code to start the javascript is: Code: <script type="text/javascript">
$(document).ready(function(){
$('#photos45').galleryView({
panel_width: 980,
panel_height: 300,
gallery_width: 980,
gallery_height: 900,
frame_width: 120,
frame_height: 50,
pause_on_hover: true,
nav_theme: 'light'
});
});
</script>
and the html is: Code: <div style="height:360px; overflow:hidden; " > <ul id="photos45"> <li><img src="../site_files/banners/cush.jpg" alt="Baffin Cush"/></a></li> <li><img src="../site_files/banners/coveralls.jpg" alt="Big Al Coveralls"/></li> <li><img src="../site_files/banners/chloe.jpg" alt="Baffin Chloe" /></li> <li><img src="../site_files/banners/chloe.jpg" alt="Baffin Chloe" /></li> </ul> </div> I have a feeling that this has something to do with the .ready function maybe it should be something else? You can see this in action he http://bit.ly/8QRXWU |
|||||||