|
JavaScript - Newbie Stuck On Compatibility Problem
I adapted (well, attempted to, at least) a quote/testimonial rotation script to fit into my website. The script works PERFECTLY on Firefox but after making my modifications, I killed it in IE...and being a total n00b to JavaScripting.....I'm totally stumped.
In Firefox, the script shows at the proper height. In Internet Explorer, the script is only shown at ~40 pixels and doesn't seem to be rotating through the different quotes (it still fades but it fades the same quote back and forth). The obvious question: HOW DO I FIX IT?!!? Original script was found at: http://www.caodesigns.com/blog/tutor....php?postID=33 My script is at: http://www.digitalctrl.org/help.html (right sidebar, in the "Testimonials" box). But something I want to know for future reference.......what is it that causes things to be formatted differently across browsers? This cross browser INcompatability is giving me grey hairs. I've been lurking around your community for a while now.....I hope you gents don't mind my first post being a question. If I need to reformat my post or do anything else to get assistance, please let me know so I can take care of it. Similar TutorialsHello, so i got one question. I have this Java Script of old facebook chat which works great at chrome and firefox with greasemonkey but when i tried to put this at IE9 with IEPro plugin , facebook just went crazy. Cant open chat at all, also all site is broken. What is problem with this script at IE,Safari or Opera? Maybe you can help me thx. You can find that script here : www.fu.sk/107159.user.js Hello all. I am doing an experiment with setTimeout for a much larger project and cant seem to get this bit of code working. What is "supposed" to happen is on hover the div goes black, and on removing the mouse it turns red after 1 second. however, it doesnt work. ive tried a bunch of variations but nothing gets it to work. i want to line up a bunch of divs and not need to write a seperate function for each one. any ideas? here is the HTML: Code: <div id="0" onMouseOver="blackit('0')" onMouseOut="fadeit('0')"></div>
<div id="1" onMouseOver="blackit('1')" onMouseOut="fadeit('1')"></div>
<div id="2" onMouseOver="blackit('2')" onMouseOut="fadeit('2')"></div>
<div id="3" onMouseOver="blackit('3')" onMouseOut="fadeit('3')"></div>
here is the JavaScript: Code: function blackit(elemID)
{
document.getElementById(elemID).style.backgroundColor="#000";
}
function fadeit(elemID)
{
setTimeout("document.getElementById(elemID).style.backgroundColor='red'", 1000);
}
there is some CSS but nothing crazy. it should work but it doesnt. the black on hover works but then it either stays black or goes red immediately, not waiting the 1 second. thanks I am trying to dynamically add rows to a table when the user clicks a button. here my function Code: function addFocusArea()
{
if(addTlFocusAreaCount <= 5)
{
//Create new Title row
var titleRow = document.createElement("tr");
var titleCol = document.createElement("th");
var titleText = document.createTextNode("Additional Focus Area " + addTlFocusAreaCount);
titleCol.appendChild(titleText);
titleRow.appendChild(titleCol);
document.getElementById("focusTable").appendChild(titleRow);
//Create new category row
var categoryRow = document.createElement("tr");
var categoryCol = document.createElement("td");
var categorySelect = document.createElement("select");
var categories = document.getElementById("<%=DecisionToolKeys.PRIMARY_FOCUS%>");
//copy a dropdown menu that is already existing on the page
for(var i=0; i<categories.length; i++)
{
var option = document.createElement("option");
option.value = categories[i].value;
option.text = categories[i].text;
categorySelect.options.add(option);
}
categoryCol.appendChild(categorySelect);
categoryRow.appendChild(categoryCol);
document.getElementById("focusTable").appendChild(categoryRow);
addTlFocusAreaCount++;
}
else
{
alert("You cannot add more than five additional practice areas.");
}
}
And here is my button Code: <input type="button" value="Add Focus Area" onclick="JavaScript:addFocusArea()"/> This is working in Firefox and Chrome, but not IE 8. Any clue as to why? Thanks, Nick Hello, I'm a newbie to javacript and indeed programming. The code below is obviously very simple but i can't figure out where i'm going wrong. Could anybody help? [CODE] function getRandomNumber(aNumber) /* ***************************************************************************** /* { var randomNumber; randomNumber = Math.random() * (aNumber); return Math.floor(randomNumber); } /*******************************************************************************/ function randomString(aString, aDelimiter) { var termArray = new Array(); termArray = aString.split(aDelimiter); var randomNumber = getRandomNumber(termArray.length) ; var randomTerm; for(var i = 0; i < termArray.length; i++) { if (termArray[i] != randomNumber) { termArray[i] = termArray[i+ 1] ; } else { termArray[i] = randomTerm; } } return randomTerm; } document.write(''+randomString('how$are$you','$'); [CODE] Hi I am populating the textboxes using a button . The code is Code: <input type="button" name="bt_autoFill" id="id_autoFill" value="Auto Fill" onclick="fillComponents()"/> this calls the javascript function Code: <script type="text/javascript">
function fillComponents()
{
document.getElementById("id_name").setAttribute("value","zedan");
document.getElementById("id_country").setAttribute("value","USA");
document.getElementById("id_Address").setAttribute("value","South Boulev.");
}
</script>
Now the code works fine when i click it the first time. However if i change a value or erase something in the textboxes the function dosnt work. all the elements are text boxes. Could you tell me what I am doing wrong ?? why doesnt it work the second time?? First of all, thanks for looking! I'm doing this nonprofit site for a students club in my college, and it needs an event calendar. I just have a bit of touch on javascript, and the only way this is going to be done in is javascript so I'm stuck with it. I took one of my assignments and modded it to the requirements of them. 1. A 6 month calendar. problem - I have to get thismonth, check whether its <July,then display Jan to June. Else July to December.(A semester calendar) figured it out. 2.Want to highlight a specific date, and place a link in it, so when somebody click the date, say a textarea in a form, displays the event details. problem - Have no idea on how to do it. Any help on this is warmly welcome ! My calendar.htm file Code: <html>
<head>
<title>Calendar</title>
<link href="calendar.css" rel="stylesheet" type="text/css" />
<script src="calendar.js" type="text/javascript"></script>
</head>
<body>
<div id="main">
<script type="text/javascript">
yearly();
</script>
</div>
</body>
</html>
My css file Code: #yearly_table {border: 1px solid black; font-size: 8pt; width: 500px;
font-family: Arial, Helvetica, sans-serif; background-color: white}
#yearly_title {color: white; background-color: rgb(223,29,29); letter-spacing: 6; font-size: 12pt}
.yearly_months {vertical-align: top; border: solid 1px black}
.monthly_table {font-size: 8pt; width: 100%; background-color: white}
.monthly_title {background-color: rgb(223,29,29); color: white; letter-spacing: 4}
.monthly_weekdays {border-bottom: 1px solid black}
.monthly_dates {text-align: right}
#today {font-weight: bold; color: rgb(223,29,29); background-color:#999;
border: 1px solid black; text-align: center}
My .js file Code: tes the month name in the monthly table
writeDayNames()
Writes the weekday title rows in the calendar table
daysInMonth(calendarDay)
Returns the number of days in the month from calendarDay
writeMonthDays(calendarDay, currentTime)
Writes the daily rows in the monthly table, highlighting
the date specified in the currentTime parameter.
writeDay(weekDay, dayCount, calendarDay, currentTime)
Write the opening and close table row tags and the table
cell tag for an individual day in the calendar.
*/
function yearly(calDate) {
if (calDate == null) calendarDay=new Date();
else calendarDay = new Date(calDate);
var currentTime = calendarDay.getTime();
var thisYear = calendarDay.getFullYear();
document.write("<table id='yearly_table'>");
document.write("<tr><th id='yearly_title' colspan='4'>"+thisYear+"</th></tr>");
var semMonth=calendarDay.getMonth();
var monthNum;
if (semMonth <6) {
monthNum = -1 }
else {
monthNum = 5; }
for (var i=1; i<=2; i++) {
document.write("<tr>");
for (var j=1; j<=3; j++) {
monthNum++;
calendarDay.setDate(1);
calendarDay.setMonth(monthNum);
writeMonthCell(calendarDay, currentTime);
}
document.write("</tr>");
}
document.write("</table>");
}
function writeMonthCell(calendarDay, currentTime) {
document.write("<td class='yearly_months'>");
writeMonth(calendarDay, currentTime);
document.write("</td>");
}
function writeMonth(calendarDay, currentTime) {
document.write("<table class='monthly_table'>");
writeMonthTitle(calendarDay);
writeDayNames()
writeMonthDays(calendarDay, currentTime);
document.write("</table>");
}
function writeMonthTitle(calendarDay) {
var monthName = new Array("January", "February", "March", "April", "May",
"June", "July", "August", "September", "October", "November", "December");
var thisMonth=calendarDay.getMonth();
document.write("<tr>");
document.write("<th class='monthly_title' colspan='7'>");
document.write(monthName[thisMonth]);
document.write("</th>");
document.write("</tr>");
}
function writeDayNames() {
var dayName = new Array("S", "M", "T", "W", "R", "F", "S");
document.write("<tr>");
for (var i=0;i<dayName.length;i++) {
document.write("<th class='monthly_weekdays'>"+dayName[i]+"</th>");
}
document.write("</tr>");
}
function daysInMonth(calendarDay) {
var thisYear = calendarDay.getFullYear();
var thisMonth = calendarDay.getMonth();
var dayCount = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
if ((thisYear % 4 == 0)&&((thisYear % 100 !=0) || (thisYear % 400 == 0))) {
dayCount[1] = 29;
}
return dayCount[thisMonth];
}
function writeMonthDays(calendarDay, currentTime) {
var weekDay = calendarDay.getDay();
document.write("<tr>");
for (var i=0; i < weekDay; i++) {
document.write("<td></td>");
}
var totalDays = daysInMonth(calendarDay);
for (var dayCount=1; dayCount<=totalDays; dayCount++) {
calendarDay.setDate(dayCount);
weekDay = calendarDay.getDay();
writeDay(weekDay, dayCount, calendarDay, currentTime);
}
document.write("</tr>");
}
function writeDay(weekDay, dayCount, calendarDay, currentTime) {
if (weekDay == 0) document.write("<tr>");
if (calendarDay.getTime() == currentTime) {
document.write("<td class='monthly_dates' id='today'>"+dayCount+"</td>");
} else {
document.write("<td class='monthly_dates'>"+dayCount+"</td>");
}
if (weekDay == 6) document.write("</tr>");
}
Lets say I have two images in a box Code: <body> <div id="box"> <img src="image1.jpg" id="image1" width="100" height="100" /> <img src="image2.jpg" id="image2" width="100" height="100" /> </div> </body> When I click on Image1 I want Image2 to get replaced with a new image, called Image3. So I tried this code: Code: var image1 = document.getElementById("image1");
image1.onclick = image1_click ();
function image1_click () {
new_image= new Image
new_image = document.getElementById("image2");
new_image.src="image3.jpg"
}
But instead of replacing the image on click, from some reason it replaces image2 with image3 from start/load. What should I do to make this work? Thank you. hi, please ignore this thread..it is a duplicate of one already active. MODS please delete. apologies for my mistake. Hi, Im a complete newbie to javascript and I've basically copied and pasted the javascript I found here to use on my site. Its an onMouseOver slideshow: http://www.javascriptkit.com/script/...ifferent.shtml to use on my site. Basically, my problem is how do I add a second, separate image in a different location on the web page, associated with this script? If I post <a href="javascript:warp()"><img src="myimage" name="targetimage" border=0></a> in two different locations, which is the script for the image, the script stops working, but having it once makes it work. So how do I add two different image locations? Can someone please help me here? I just want to add more images in a different location. ie have image location 1, and image location 2. Thanks in advance Script Below: Code: <script>
function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink1
}
</script>
<script language="JavaScript1.1">
var myimages=new Array()
var gotolink="#"
function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}
preloadimages(my images here)
</script>
For the Links:
<a href="creativewriting.html" onMouseover="changeimage(myimages[1],this.href)">Creative Writing</a><br>
For the Image:
<a href="javascript:warp()"><img src="myimage" name="targetimage" border=0></a>
I'm just learning code. I did a small reaction game project. The idea is that the player is to click on only circles. It works unless a square comes up & is clicked on. My code is he Learning Javascript Here is the actual game: Learning Javascript Any help is appreciated! No matter what I do, I have these two scripts, I really want on the same page 1. Is carouselGallery 2. Is flv player <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> <!-- body { text-align:center; margin-top: 100px; background-color: #111; } --> </style> <script type="text/javascript" src="js/swfobject.js"></script> <script type="text/javascript"> var flashvars = { imagesXmlPath: "" }; var params = { base: "", salign:"lt", menu:"false" }; var attributes = { }; swfobject.embedSWF("carouselGallery.swf", "myContent", "800", "400", "9.0.0", "expressInstall.swf", flashvars, params, attributes); </script></head> <body> <div id="myContent"> <h1>Alternative content</h1> <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p> </div> </body> </html> Second Is <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <title>FLV Player FlashVars Example</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script type="text/javascript" src="swfobject/swfobject.js"></script> </head> <body> <div id="myContent"> <h1>Please Upgrade Your Flash Player</h1> <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p> </div> <script type="text/javascript"> var flashvars = { flvpFolderLocation: "flvplayer/", flvpVideoSource: "your_video_source", flvpWidth: "640", flvpHeight: "360" }; var params = { menu: "true", allowfullscreen: "true" }; swfobject.embedSWF("FLVplayer.swf", "myContent", "640", "360", "9.0.0", "swfobject/expressInstall.swf", flashvars, params); </script> </body> </html> Can someone please help me figure out how to get both to display on the page? Any help would be GREATLY appreciated. Hi! I'm new with javascript and jQuery in general. So if anyone could help me out it would be greatly appreciated. When the browser is finished loading I want #page2 to be loaded automatically. I can get it to work with: $(document).ready(function () { $('#page2').delay(200); $('#page2').show('slow'); }); But when I click on page2 (when first launched) it wants to load again. It seems like it doesn't understand #page2 is already loaded. I want it to do absolutely nothing when the user clicks on the page2 navigation button. I hope that I explained my problem correctly. Again, I'm a newbie at this and the fact that I got to this point is already a miracle. Thanks in advance! This is my code so far: $(document).ready(function () { $('#page2').delay(200); $('#page2').show('slow'); }); $(function(){ $('#content:not(.nav_block)>dt:not(.active) a,footer .privacy:not(.active) a[rel=privacy]').live('click',function(){ var next=this.rel=='privacy'? $('#privacy'):$(this).parent().next(), width=next.width(), parent=next.parent(), visible=parent.find('>dd:visible').css({overflow:'hidden'}) parent.addClass('nav_block') $('#content>dt,.privacy').removeClass('active') $(this).parent().addClass('active') if(this.rel=='privacy') $('#content>dt>a').removeClass('active').animate({opacity:0}) if(parent.css('left')!=0) next.parent().animate({left:0}) next.show().css({width:'64px'}).stop().animate({width:width+'px'},{ step:visible.length?function(now){ visible.width(width-now) }:'',complete:function(){ next.css({overflow:'visible'}) visible.css({width:width+'px'}).hide() parent.removeClass('nav_block') }}) return false }) <!-- THE PROBLEM SHOULD BE HERE, RIGHT ? --> $('.active a,#content.nav_block').live('click',function(){ return false }) Download the file: http://www.filedropper.com/testfile_1 I am learning JavaScript and found these tutorials at http://www.codecademy.com/courses/pr...#!/exercises/3 this is the one I got stuck on, I don't understand .. I just seem to have a block on what to do to this to make it change the while condition so that this do/while loop iterates 4 times like the tutorial wants me to do ... I have had to kill the page because it seems to be making a loop that messes w/ the browser and locks it up. ?? Code: var i = 4;
do {
console.log("This is iteration " + (i + 1) + ".");
i++;
}
while( );
I would love some help on this code I was assigned to debug...I never studied javascript nor have ever coded really, yet my boss(im volunteering at a company) is having me debug a website and I can't seem to figure this out. The problem is the menus stay expanded when the mouse is out, but when you activate the onMouseOver, it fixes it. Here is an extremely simplified version but it shows the problem. And I greatly appreciate any help I can get. Thanks in advance! Oh and I didn't write any of this + im a noob at coding so if the answer was explained with this in mind that'd be great! ----------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <!-- xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"> --> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Yep</title> <link href="ReferenceFunctions.css" rel="stylesheet" type="text/css" /> <!--<script type="text/javascript" src="/offices/management_support/js/tab-view.js"></script>--> <!-- ************************ BEGIN Section 1 *************************************** --> <script type="text/javascript"> function ManageTabPanelDisplay() { // // Between the parenthesis, list the id's of the div's that // will be effected when tabs are clicked. List in any // order. Put the id's in single quotes (apostrophes) // and separate them with a comma -- all one line. // var idlist = new Array('tab1focus','tab2focus','tab3focus','tab1ready','tab2ready','tab3ready','content1','content2', 'content3'); // No other customizations are necessary. if(arguments.length < 1) { return; } for(var i = 0; i < idlist.length; i++) { var block = false; for(var ii = 0; ii < arguments.length; ii++) { if(idlist[i] == arguments[ii]) { block = true; break; } } if(block) { document.getElementById(idlist[i]).style.display = "block"; } else { document.getElementById(idlist[i]).style.display = "none"; } } } //SuckerTree Horizontal Menu (Sept 14th, 06) //By Dynamic Drive: http://www.dynamicdrive.com/style/ var menuids=["treemenu1"] //Enter id(s) of SuckerTree UL menus, separated by commas function buildsubmenus_horizontal(){ for (var i=0; i<menuids.length; i++){ var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul") for (var t=0; t<ultags.length; t++){ if (ultags[t].parentNode.parentNode.id==menuids[i]){ //if this is a first level submenu ultags[t].style.top=ultags[t].parentNode.offsetHeight+"px" //dynamically position first level submenus to be height of main menu item ultags[t].parentNode.getElementsByTagName("a")[0].className="mainfoldericon" } else{ //else if this is a sub level menu (ul) ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it ultags[t].parentNode.getElementsByTagName("a")[0].className="subfoldericon" } ultags[t].parentNode.onmouseover=function(){ this.getElementsByTagName("ul")[0].style.visibility="visible" } ultags[t].parentNode.onmouseout=function(){ this.getElementsByTagName("ul")[0].style.visibility="hidden" } } } } if (window.addEventListener) window.addEventListener("load", buildsubmenus_horizontal, false) else if (window.attachEvent) window.attachEvent("onload", buildsubmenus_horizontal) </script> <!-- ************************ END Section 1 *************************************** --> <!-- ************************ BEGIN Section 2 *************************************** --> <script type="text/javascript"> <!-- *************Not sure why this is commented out ******** window.onload=montre; function montre(id) { var d = document.getElementById(id); for (var i = 1; i<=15; i++) { if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';} } if (d) {d.style.display='block';} } //--> </script> <!-- ************************ END Section 2 *************************************** --> <!-- ************************ BEGIN Section 3 *************************************** --> <script type="text/javascript"> function decide() { if (document.myca.search.value.length < 1) { window.alert ("Please enter a search keyword."); return false; } if (document.myca.whosearch[0].checked) { document.myca.sSearchString.value = document.myca.search.value; document.myca.submit(); } else { if (document.myca.whosearch[1].checked) { document.thissite[1].value = document.myca.search.value; document.thissite.submit(); } else { alert("You must select whether you want to search My CA or This Site."); } } return false; } </script> <!-- ************************ END Section 3 *************************************** --> <!-- ************************ BEGIN Section 4 *************************************** --> <script type="text/javascript"> <!--*************Not sure why this is commented out ********--> <!-- var defaultMainList = "Home"; function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } function FP_swapImg() {//v1.0 var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2; n<args.length; n+=2) { elm=FP_getObjectByID(args[n]); if(elm) { doc.$imgSwaps[doc.$imgSwaps.length]=elm; elm.$src=elm.src; elm.src=args[n+1]; } } } function FP_preloadImgs() {//v1.0 var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array(); for(var i=0; i<a.length; i++) { d.FP_imgs[i]=new Image; d.FP_imgs[i].src=a[i]; } } function FP_getObjectByID(id,o) {//v1.0 var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById) el=o.getElementById(id); else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el; if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c) for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; } f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements; for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return el; } } return null; } --> </script> <!-- ************************ END Section 4 *************************************** --> <!-- ************************ BEGIN Section 5 *************************************** --> <style type="text/css"> .blueLink { font-family: Arial, Helvetica, sans-serif; font-weight: bold; color: #000066; font-size: 71%; } .Office_functions_sub_title { font-size: xx-small; color: #0066CC; } .style1 { font-size: small } .pixel_height { font-size: 5px; } .blank_menu_space_height { font-size: 5px; font-family: Arial; } .turquoise { color: #00FFCC } .blue_font { color: #0000FF; font-size: small; } body { margin-top: 0px; margin-bottom: 0px; } .style7 {color: #000066} .style10 {font-family: Verdana, Arial, Helvetica, sans-serif} .style11 { font-size: 12px } .style12 {font-size: 14px} .style13 {font-size: 65%} .style14 {font-size: 12px; color: #800000; } .style15 { color: #FFFFFF; font-weight: bold; font-size: small; } .style17 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #4d7fb2; font-weight: bold; } .style19 { font-family: "Times New Roman", Times, serif; font-size: 18pt; color: #FFFF00; } .style22 {font-size: 11px} </style> <!-- ************************ END Section 5 *************************************** --> </head> <body onload="FP_preloadImgs(/*url*/'images/button13.jpg', /*url*/'images/button4a.jpg'); MM_preloadImages('indeed.jpg' )"> <!--<body onload="MM_preloadImages('yep.jpg','yep.jpg')">--> <table width="900" border="0" align="center" cellpadding="0" cellspacing="0"> <!-- ************************ BEGIN Section 6 *************************************** --> <tr> <!--BEGIN Table Set-Up --> <!--CLOSE Table Set-Up --> </tr> <!-- ************************ END Section 6 *************************************** --> <!-- ************************ BEGIN Section 7 *************************************** --> <tr> <td style="height:17px"><div align="center" class="style15"> <table width="100%" border="1"> <tr> <td><div align="center">link</div></td> </tr> </table> </div></td> </tr> <!-- BEGIN Table Set-Up 1 --> <tr> <td><table width="100%" border="0" cellspacing="0" cellpadding="0" style="background-color:#ffffff"> <tr> <td valign="top" style="padding-left:12px; text-align:left; line-height:186%;"><table width="100%" border="0" cellspacing="0" cellpadding="0" style="background-color:#ffffff"> <!-- BEGIN Table Set-Up 2 --> <tr> <td rowspan="72" valign="top"><table border="0" cellspacing="0" cellpadding="0" style="background-color:#fff"> <!--BEGIN Example Office- Menut Table SET-UP--> <tr> <td valign="top" style="padding-right:12px"><table border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td><table width="185" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td height="9px"></td> </tr> <tr> <td class="boxtitle style12">testings12345</td> </tr> <!-- BEGIN Sub-Section A thru C --> <tr> <td><div class="left_column_top"> <dl id="menu"> <!-- ************************ BEGIN Sub-Section A *************************************** --> <dt onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre();"> <a href="link.htm">link</a></dt> <!-- ************************ END Sub-Section A *************************************** --> <!-- ************************ BEGIN Sub-Section B *************************************** --> <dt onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre();"> <a href="link.htm">link</a></dt> <dd id="smenu2" onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre();"> <ul> <li><a href="link.htm"> link</a></li> <li><a href="link.htm"> link</a></li> <li><a href="link.htm"> link</a></li> <li><a href="link.htm">link</a></li> <li><a href="link.htm">link</a></li> </ul> </dd> <!-- ************************ END Sub-Section B *************************************** --> <!-- ************************ BEGIN Sub-Section C *************************************** --> <dt onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();"> <a href="link.htm"> link</a></dt> <dd id="smenu3" onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();"> <ul> <li><a href="link.pdf"> link</a></li> <li><a href="link.pdf"> link</a></li> <li><a href="link.pdf"> link</a></li> <li><a href="link.htm"> link</a></li> <li><a href="link.htm">link</a></li> <li><a href="link.htm"> link</a></li> <li><a href="link.htm"> link</a></li> <li><a href="link.htm"> link</a></li> <li><a href="link.htm"> link</a></li> </ul> </dd> <!-- ************************ END Sub-Section C *************************************** --> <dt onmouseover="javascript:montre('smenu4');" onmouseout="javascript:montre();"> <a href="ble.htm" style="line-height: 200%"> link<br /> link </a></dt> <dd id="smenu4" onmouseover="javascript:montre('smenu4');" onmouseout="javascript:montre();"> <ul> <li><a href="link233link.htm"> link</a></li> <li><a href="indeedy.htm"> link</a></li> <li><a href="training/linsks.htm"> link</a></li> </ul> </dd> <dt onmouseover="javascript:montre('smenu5');" onmouseout="javascript:montre();"> <a href="yep.htm"> link</a></dt> <dt onmouseover="javascript:montre('smenu6');" onmouseout="javascript:montre();"> <a href="indeed.htm"> link</a></dt> <dt onmouseover="javascript:montre('smenu7');" onmouseout="javascript:montre();"> <a href="thanks.htm"> link</a></dt> </dl> </div></td> </tr> <!-- CLOSE Sub-Section A thru C --> </table></td> </tr> <td><table width="185px" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td height="40px"></td> </tr> <tr> <td class="boxtitle style12">link</td> </tr> <!--BEGIN Sub-Section D thru F --> <tr> <td><div class="left_column_bottom" style="height:125px"> <dl id="menu"> <!-- ************************ BEGIN Sub-Section D *************************************** --> <dt onmouseover="javascript:montre('smenu10');" onmouseout="javascript:montre();"> <a href="yes.htm">link</a></dt> <dt onmouseover="javascript:montre('smenu11');" onmouseout="javascript:montre();"> <a href="yep.htm">random words</a></dt> <dt onmouseover="javascript:montre('smenu12');" onmouseout="javascript:montre();"> <a href="tests.htm"> <p style="line-height: 200%; margin-top: 1px; margin-bottom: 1px"> ble<br> mhm</p></a></dt> <dt onmouseover="javascript:montre('smenu13');" onmouseout="javascript:montre();"> <a href="communication/testsss.htm">Just some test</a></dt> <!-- ************************ END Sub-Section D *************************************** --> </dl> </div></td> </tr> <tr> <td > </td> </tr> <!--CLOSE Sub-Section D thu F --> </table></td> </tr> <tr> <td align="center"> <p align="center" id="legal"><!-- Original Template Designed by etc --> <a href="#heading"></a></p> </td> </tr> <!-- BEGIN Office Chief Table --> </table></td></tr> <!-- </td> SICR TAble --> <!-- </tr> CLOSE only TR Table Set-Up 2 --> </table> <p align="center"> </table> <!--CLOSE MAIN TABLE--> <a href="#heading"> Back to Top</a><br /> </td> </tr> </table> </td> </tr> <!-- CLOSE Table Set-Up 1 --> <!-- ************************ END Section 7 *************************************** --> </p> <tr> <td style="height:1px ;background-color:#CCCCCC"></td> </tr> </body> </html> www.dreamdiamond.squarespace.com This is a website I'm building for a friend. Its very basic, as is my knowledge of web design, BUT, there is one important thing I cant seem to figure out before we register it as dreamdiamond.com! ok the code on THIS website : http://tablefilter.free.fr/ I cant seem to implement into the diamond website on the Inventory Page. We need to create a filterable table for spec. diamonds and this is driving me nuts. I tried uploading the .js files through the file storage, and put the java script code into the website settings>code injection> header No matter what it's not working though. Is there anyone who can help walk me through it? Or I can give someone the username/ pass so they can maybe help me set it up? Obv the pass would be changed afterwards LOL If you can help me out man I'll be forever grateful lol hi, im new to the html and javascript stuff and am coding my own site, and currently stuck. hope someone can help! for my website layout, i want to have 4-5 buttons on the left side for the different links, and on the right half i want to load that link without reloading the entire webpage. currently i have it so that everything is in tables, so table's left column contains the links (for example - Link1, Link2, Link3, Link4, Link5). now when i were to click any of those i want the page corresponding to that link to open up in the right column without reloading the entire page. i'm stuck on how to pass what i click on the left to load up on the right. any help would be nice! thanks ok guys im going to be honest here, i know nothing about javascript. ive been learning php and even that gets confusing at times. my issue: i bought a script off someone(php site) and it has a .php file that using .js files he had no idea how to fix the issue so im hoping you guys can help me fix it. this one .php page includes another .php file and 2 other .js files. i dont want to go and post every single file as one of them is like 1200 lines (i have if you like to hunt for errors) is there some code i can add in to make it show where its getting an error? i know you can in php and mysql the page get stuck on Loading... on the .php file which is line 647: AJS.setHTML(AJS.$('load'), 'Loading...') AJS.js & ocNewFixed.php (Starting page) all files can be downloaded he http://uppit.com/1233dylkbrfu/help.rar (too long to fit into 20k characters) Help would be appreciated. Can anyone tell me why? Here is the code: PHP Code: <html> <head> <title>clock</title> <style type="text/css"> <!-- body { color: #111111; font-family: Tahoma; font-size: 13px; } a { text-decoration:none; color:#222222; } a:hover { text-decoration:underline; } --> </style> <script type="text/javascript"> clock = { check:function(a){ return (a<10)? "0"+a : a }, show:function() { var time = new Date() var hours = this.check(time.getHours()) var minu = this.check(time.getMinutes()) var sec = this.check(time.getSeconds()) document.getElementById('time').innerHTML="Now the time is: " + hours + ":" + minu + ":" + sec setInterval("clock.show()",1000) }, }; </script> </head> <body onLoad="clock.show();"> <div id="time"></div> </body> </html> Hey everyone - got a Q... I'm having a tabbed panel where the 1st div is originally shown with display: block and the other 3 are display:none to hide, obviously. I want each div to have their own link where if you click the link for div 2 it hides the previous and shows that one etc. Here's what I originally have: Code: <script type="text/javascript">
function tab2() {
document.getElementById('tab-content-2').style.display="block";
document.getElementById('tab-content-1').style.display="none";
}
</script>
<div id="tab-top">
<div class="tab-top-l">
</div>
<div class="tab-top-main">
<ul>
<a href="#" title="Lorem et"><li>Lorem et</li></a>
<a href="#" title="Lorem et" onclick="tab2()"><li class="not-first">Lorem et</li></a>
<a href="#" title="Lorem et"><li class="not-first">Lorem et</li></a>
<a href="#" title="Lorem et"><li class="not-first">Lorem et</li></a>
</ul>
</div>
<div class="tab-top-r">
</div>
</div>
<div id="tab-content-1" style="display: block;">
Content 1
</div>
<div id="tab-content-2" style="display: none;">
Content 2
</div>
<div id="tab-content-3" style="display: none;">
Content 3
</div>
<div id="tab-content-4" style="display: none;">
Content 4
</div>
That successfully hides tab 1 and shows tab 2 but I don't know how to do it properly so it hides the previously shown one. One tab should always be shown. Image attached to show what I mean. This code is designed to send people either to List 1 or List 2 in the Aweber form. At this time, I cannot make the uncheck go to List 2 to receive that thankyou email. Can you tell me what is wrong??? Check--Yes I would like to subscribe--List 1 email--thank you uncheck--No, I do not want to subscribe--List 2--you need more information I am omitting the top of the Aweber code before <body>-- <script language="javascript"> function magCheck(){ var magcheckbox = document.MainForm.magcheckbox.checked; if(magcheckbox == true){ document.getElementById("keylivingwell").value = '1355523361' document.getElementById("redirect").value = 'http://www.aweber.com/thankyou-coi.htm?m=text'; }else if(magcheckbox == false){ document.getElementById("keylivingwund").value = '1357528764' document.getElementById("redirect").value = 'http://www.aweber.com/thankyou-coi.htm?m=text'; } } </script> { } </style> <form method="post" class="af-form-wrapper" action="http://www.aweber.com/scripts/addlead.pl" > <div style="display: none;"> <input type="hidden" id="meta_web_form_id" name="meta_web_form_id" value="1355523361" /> <input type="hidden" name="meta_split_id" value="" /> <input type="hidden" name="listname" value="keylivingwell" /> <input type="hidden" name="redirect" value="http://www.aweber.com/thankyou-coi.htm?m=text" id="redirect_77879d6b0d1bc03d212e86d72e1eae3c" /> <input type="hidden" name="meta_adtracking" value="Key_to_Living_Well_in_Retirement" /> <input type="hidden" name="meta_message" value="1" /> <input type="hidden" name="meta_required" value="name,email" /> <input type="hidden" name="meta_tooltip" value="" /> </div> <div id="af-form-1355523361" class="af-form"><div id="af-header-1355523361" class="af-header"><div class="bodyText"><p> Yes, thank you, I would like</p> <p> a copy of the Report!</p></div></div> <div id="af-body-1355523361" class="af-body af-standards"> <div class="af-element"> <label class="previewLabel" for="awf_field-25981213">Name: </label> <div class="af-textWrap"> <input id="awf_field-25981213" type="text" name="name" class="text" value="" tabindex="500" /> </div> <div class="af-clear"></div></div> <div class="af-element"> <label class="previewLabel" for="awf_field-25981214">Email: </label> <div class="af-textWrap"><input class="text" id="awf_field-25981214" type="text" name="email" value="" tabindex="501" /> </div><div class="af-clear"></div> </div> <div class="af-element buttonContainer"> <input name="submit" id="af-submit-image-1355523361" type="image" class="image" style="background: none;" alt="Submit Form" src="http://www.aweber.com/images/forms/modern/blue/button.png" tabindex="502" /> <div class="af-clear"></div> </div> <div class="af-element privacyPolicy" style="text-align: center"><p><a title="Privacy Policy" href="http://www.aweber.com/permission.htm" target="_blank">We respect your email privacy</a></p> <div class="af-clear"></div> </div> <div class="af-element poweredBy" style="text-align: center; font-size: 9px;"><p>Powered by <a href="http://www.aweber.com" title="Email Marketing Services">AWeber</a> <a href="http://www.aweber.com" title="Email Marketing Services">Email Marketing Services</a></p> <div class="af-clear"></div> </div> </div> <div id="af-footer-1355523361" class="af-footer"><input id="magcheckbox" name="magcheckbox" onclick="magCheck();" type="checkbox" value="1" checked> <div class="bodyText"><p><span style="font-size: 14px;"> Yes, I would like to subscribe</span></p> <p><span style="font-size: 14px;"> to Baby Boomers Magazine.</span> </p></div></div> </div> <div style="display: none;"><img src="http://forms.aweber.com/form/displays.htm?id=jMysrKxMzMxsjA==" alt="" /></div> </form> <script type="text/javascript"> <!-- (function() { var IE = /*@cc_on!@*/false; if (!IE) { return; } if (document.compatMode && document.compatMode == 'BackCompat') { if (document.getElementById("af-form-1355523361")) { document.getElementById("af-form-1355523361").className = 'af-form af-quirksMode'; } if (document.getElementById("af-body-1355523361")) { document.getElementById("af-body-1355523361").className = "af-body inline af-quirksMode"; } if (document.getElementById("af-header-1355523361")) { document.getElementById("af-header-1355523361").className = "af-header af-quirksMode"; } if (document.getElementById("af-footer-1355523361")) { document.getElementById("af-footer-1355523361").className = "af-footer af-quirksMode"; } } })(); --> </script> I have looked at it so long time, I can't find it. Thanks for your help, Pat |
|||||||