Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jun 2009
    Location
    California
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy Events Calendar Help - Moz. Goes to Top on Click

    Hi All,

    I d/l'd the Events Calendar from javascriptkit.com and was wondering if you could help me figure out how to prevent Mozilla from resetting to the top of the page when a user clicks on the month/year buttons.



    It seems only Mozilla is having this issue -- clicking on the buttons in IE7 doesn't cause the page to reset to the top.

    Thanks for the help!

    Sincerely,
    vm

    ________________________________________________________________

    This is in the Header:
    Code:
    <script type="text/javascript" src="css/event.js"></script> 
    
    <script language="JavaScript" type="text/javascript" src="css/events.js"></script>
    
    <script type="text/JavaScript" language="JavaScript">
    /* Preload images script */
    var myimages=new Array()
    
    function preloadimages(){
    	for (i=0;i<preloadimages.arguments.length;i++){
    		myimages[i]=new Image();
    		myimages[i].src=preloadimages.arguments[i];
    	}
    }
    
    
    /* The path of images to be preloaded inside parenthesis: (Extend list as desired.) */
    preloadimages("images/PrevYrOff40x40.jpg","images/PrevYrOn40x40.jpg","images/PrevMoOff40x40.jpg","images/PrevMoOn40x40.jpg","images/NextYrOff40x40.jpg","images/NextYrOn40x40.jpg","images/NextMoOff40x40.jpg","images/NextMoOn40x40.jpg");
    
    
    /***************************************************************************************
    	JavaScript Calendar - Digital Christian Design
    	//Script featured on and available at JavaScript Kit: http://www.javascriptkit.com
    	// Functions
    		changedate(): Moves to next or previous month or year, or current month depending on the button clicked.
    		createCalendar(): Renders the calander into the page with links for each to fill the date form filds above.
    			
    ***************************************************************************************/
    
    var thisDate = 1;							// Tracks current date being written in calendar
    var wordMonth = new Array("January","February","March","April","May","June","July","August","September","October","November","December");
    var today = new Date();							// Date object to store the current date
    var todaysDay = today.getDay() + 1;					// Stores the current day number 1-7
    var todaysDate = today.getDate();					// Stores the current numeric date within the month
    var todaysMonth = today.getUTCMonth() + 1;				// Stores the current month 1-12
    var todaysYear = today.getFullYear();					// Stores the current year
    var monthNum = todaysMonth;						// Tracks the current month being displayed
    var yearNum = todaysYear;						// Tracks the current year being displayed
    var firstDate = new Date(String(monthNum)+"/1/"+String(yearNum));	// Object Storing the first day of the current month
    var firstDay = firstDate.getUTCDay();					// Tracks the day number 1-7 of the first day of the current month
    var lastDate = new Date(String(monthNum+1)+"/0/"+String(yearNum));	// Tracks the last date of the current month
    var numbDays = 0;
    var calendarString = "";
    var eastermonth = 0;
    var easterday = 0;
    
    
    function changedate(buttonpressed) {
    	if (buttonpressed == "prevyr") yearNum--;
    	else if (buttonpressed == "nextyr") yearNum++;
    	else if (buttonpressed == "prevmo") monthNum--;
    	else if (buttonpressed == "nextmo") monthNum++;
    	else  if (buttonpressed == "return") { 
    		monthNum = todaysMonth;
    		yearNum = todaysYear;
    	}
    
    	if (monthNum == 0) {
    		monthNum = 12;
    		yearNum--;
    	}
    	else if (monthNum == 13) {
    		monthNum = 1;
    		yearNum++
    	}
    
    	lastDate = new Date(String(monthNum+1)+"/0/"+String(yearNum));
    	numbDays = lastDate.getDate();
    	firstDate = new Date(String(monthNum)+"/1/"+String(yearNum));
    	firstDay = firstDate.getDay() + 1;
    	createCalendar();
    	return;
    }
    
    
    function easter(year) {
    // feed in the year it returns the month and day of Easter using two GLOBAL variables: eastermonth and easterday
    var a = year % 19;
    var b = Math.floor(year/100);
    var c = year % 100;
    var d = Math.floor(b/4);
    var e = b % 4;
    var f = Math.floor((b+8) / 25);
    var g = Math.floor((b-f+1) / 3);
    var h = (19*a + b - d - g + 15) % 30;
    var i = Math.floor(c/4);
    var j = c % 4;
    var k = (32 + 2*e + 2*i - h - j) % 7;
    var m = Math.floor((a + 11*h + 22*k) / 451);
    var month = Math.floor((h + k - 7*m + 114) / 31);
    var day = ((h + k - 7*m +114) % 31) + 1;
    eastermonth = month;
    easterday = day;
    }
    
    
    function createCalendar() {
    	calendarString = '';
    	var daycounter = 0;
    	calendarString += '<table width="312" border="1" cellpadding="0" cellspacing="1">';
    	calendarString += '<tr>';
    	calendarString += '<td align=\"center\" valign=\"center\" width=\"40\" height=\"40\"><a href=\"#\" onMouseOver=\"document.PrevYr.src=\'images\/PrevYrOn40x40\.jpg\';\" onMouseOut=\"document.PrevYr.src=\'images\/PrevYrOff40x40\.jpg\';\" onClick=\"changedate(\'prevyr\')\"><img name=\"PrevYr\" src=\"images\/PrevYrOff40x40\.jpg\" width=\"40\" height=\"40\" border=\"0\" alt=\"Prev Yr\"\/><\/a><\/td>';
    	calendarString += '<td align=\"center\" valign=\"center\" width=\"40\" height=\"40\"><a href=\"#\" onMouseOver=\"document.PrevMo.src=\'images\/PrevMoOn40x40\.jpg\';\" onMouseOut=\"document.PrevMo.src=\'images\/PrevMoOff40x40\.jpg\';\" onClick=\"changedate(\'prevmo\')\"><img name=\"PrevMo\" src=\"images\/PrevMoOff40x40\.jpg\" width=\"40\" height=\"40\" border=\"0\" alt=\"Prev Mo\"\/><\/a><\/td>';
    	calendarString += '<td bgcolor=\"#e5e5df\" align=\"center\" valign=\"center\" width=\"128\" height=\"40\" colspan=\"3\"><b>' + wordMonth[monthNum-1] + '&nbsp;&nbsp;' + yearNum + '<\/b><\/td>';
    	calendarString += '<td align=\"center\" valign=\"center\" width=\"40\" height=\"40\"><a href=\"#\" onMouseOver=\"document.NextMo.src=\'images\/NextMoOn40x40\.jpg\';\" onMouseOut=\"document.NextMo.src=\'images\/NextMoOff40x40\.jpg\';\" onClick=\"changedate(\'nextmo\')\"><img name=\"NextMo\" src=\"images\/NextMoOff40x40\.jpg\" width=\"40\" height=\"40\" border=\"0\" alt=\"Next Mo\"\/><\/a><\/td>';
    	calendarString += '<td align=\"center\" valign=\"center\" width=\"40\" height=\"40\"><a href=\"#\" onMouseOver=\"document.NextYr.src=\'images\/NextYrOn40x40\.jpg\';\" onMouseOut=\"document.NextYr.src=\'images\/NextYrOff40x40\.jpg\';\" onClick=\"changedate(\'nextyr\')\"><img name=\"NextYr\" src=\"images\/NextYrOff40x40\.jpg\" width=\"40\" height=\"40\" border=\"0\" alt=\"Next Yr\"\/><\/a><\/td>';
    	calendarString += '<\/tr>';
    	calendarString += '<tr>';
    	calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Sun<\/td>';
    	calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Mon<\/td>';
    	calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Tue<\/td>';
    	calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Wed<\/td>';
    	calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Thu<\/td>';
    	calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Fri<\/td>';
    	calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Sat<\/td>';
    	calendarString += '<\/tr>';
    
    	thisDate == 1;
    
    	for (var i = 1; i <= 6; i++) {
    		calendarString += '<tr>';
    		for (var x = 1; x <= 7; x++) {
    			daycounter = (thisDate - firstDay)+1;
    			thisDate++;
    			if ((daycounter > numbDays) || (daycounter < 1)) {
    				calendarString += '<td align=\"center\" bgcolor=\"#888888\" height=\"30\" width=\"40\">&nbsp;<\/td>';
    			} else {
    				if (checkevents(daycounter,monthNum,yearNum,i,x) || ((todaysDay == x) && (todaysDate == daycounter) && (todaysMonth == monthNum))){
    					if ((todaysDay == x) && (todaysDate == daycounter) && (todaysMonth == monthNum)) {
    						calendarString += '<td align=\"center\" bgcolor=\"#24c7c5\" height=\"30\" width=\"40\"><a href=\"javascript:showevents(' + daycounter + ',' + monthNum + ',' + yearNum + ',' + i + ',' + x + ')\">' + daycounter + '<\/a><\/td>';
    					}
     					else	calendarString += '<td align=\"center\" bgcolor=\"#f96b07\" height=\"30\" width=\"40\"><a href=\"javascript:showevents(' + daycounter + ',' + monthNum + ',' + yearNum + ',' + i + ',' + x + ')\">' + daycounter + '<\/a><\/td>';
    				} else {
    					calendarString += '<td align=\"center\" bgcolor=\"#c0c0c0\" height=\"30\" width=\"40\">' + daycounter + '<\/td>';
    				}
    			}
    		}
    		calendarString += '<\/tr>';
    	}
    
    
    	var object=document.getElementById('calendar');
    	object.innerHTML= calendarString;
    	thisDate = 1;
    }
    
    
    function checkevents(day,month,year,week,dayofweek) {
    var numevents = 0;
    var floater = 0;
    
    	for (var i = 0; i < events.length; i++) {
    		if (events[i][0] == "W") {
    			if ((events[i][2] == dayofweek)) numevents++;
    		}
    		else if (events[i][0] == "Y") {
    			if ((events[i][2] == day) && (events[i][1] == month)) numevents++;
    		}
    		else if (events[i][0] == "F") {
    			if ((events[i][1] == 3) && (events[i][2] == 0) && (events[i][3] == 0) ) {
    				easter(year);
    				if (easterday == day && eastermonth == month) numevents++;
    			} else {
    				floater = floatingholiday(year,events[i][1],events[i][2],events[i][3]);
    				if ((month == 5) && (events[i][1] == 5) && (events[i][2] == 4) && (events[i][3] == 2)) {
    					if ((floater + 7 <= 31) && (day == floater + 7)) {
    						numevents++;
    					} else if ((floater + 7 > 31) && (day == floater)) numevents++;
    				} else if ((events[i][1] == month) && (floater == day)) numevents++;
    			}
    		}
    		else if ((events[i][2] == day) && (events[i][1] == month) && (events[i][3] == year)) {
    			numevents++;
    		}
    	}
    
    	if (numevents == 0) {
    		return false;
    	} else {
    		return true;
    	}
    }
    
    
    function showevents(day,month,year,week,dayofweek) {
    var theevent = "";
    var floater = 0;
    
    	for (var i = 0; i < events.length; i++) {
    		// First we'll process recurring events (if any):
    		if (events[i][0] != "") {
    			if (events[i][0] == "D") {
    			}
    			if (events[i][0] == "W") {
    				if ((events[i][2] == dayofweek)) {
    				theevent += "Events of: \n" + month +'/'+ day +'/'+ year + '\n';
    				theevent += events[i][6] + '\n';
    				theevent += '\n -------------- \n\n';
    				theevent += 'Start Time: ' + events[i][4] + '\n';
    				theevent += 'Ending Time: ' + events[i][5] + '\n';
    				theevent += '\n -------------- \n\n';
    				theevent += 'Description: ' + events[i][7] + '\n';
    
    				document.forms.eventform.eventlist.value = theevent;
    				}
    			}
    			if (events[i][0] == "M") {
    			}
    			if (events[i][0] == "Y") {
    				if ((events[i][2] == day) && (events[i][1] == month)) {
    				theevent += "Events of: \n" + month +'/'+ day +'/'+ year + '\n';
    				theevent += events[i][6] + '\n';
    				theevent += '\n -------------- \n\n';
    				theevent += 'Start Time: ' + events[i][4] + '\n';
    				theevent += 'Ending Time: ' + events[i][5] + '\n';
    				theevent += '\n -------------- \n\n';
    				theevent += 'Description: ' + events[i][7] + '\n';
    
    				document.forms.eventform.eventlist.value = theevent;
    				}
    			}
    			if (events[i][0] == "F") {
    				if ((events[i][1] == 3) && (events[i][2] == 0) && (events[i][3] == 0) ) {
    					if (easterday == day && eastermonth == month) {
    						theevent += "Events of: \n" + month +'/'+ day +'/'+ year + '\n';
    						theevent += events[i][6] + '\n';
    						theevent += '\n -------------- \n\n';
    						theevent += 'Start Time: ' + events[i][4] + '\n';
    						theevent += 'Ending Time: ' + events[i][5] + '\n';
    						theevent += '\n -------------- \n\n';
    						theevent += 'Description: ' + events[i][7] + '\n';
    
    						document.forms.eventform.eventlist.value = theevent;
    					} 
    				} else {
    					floater = floatingholiday(year,events[i][1],events[i][2],events[i][3]);
    
    					if ((month == 5) && (events[i][1] == 5) && (events[i][2] == 4) && (events[i][3] == 2)) {
    						if ((floater + 7 <= 31) && (day == floater + 7)) {
    							theevent += "Events of: \n" + month +'/'+ day +'/'+ year + '\n';
    							theevent += events[i][6] + '\n';
    							theevent += '\n -------------- \n\n';
    							theevent += 'Start Time: ' + events[i][4] + '\n';
    							theevent += 'Ending Time: ' + events[i][5] + '\n';
    							theevent += '\n -------------- \n\n';
    							theevent += 'Description: ' + events[i][7] + '\n';
    
    							document.forms.eventform.eventlist.value = theevent;
    						} else if ((floater + 7 > 31) && (day == floater)) {
    							theevent += "Events of: \n" + month +'/'+ day +'/'+ year + '\n';
    							theevent += events[i][6] + '\n';
    							theevent += '\n -------------- \n\n';
    							theevent += 'Start Time: ' + events[i][4] + '\n';
    							theevent += 'Ending Time: ' + events[i][5] + '\n';
    							theevent += '\n -------------- \n\n';
    							theevent += 'Description: ' + events[i][7] + '\n';
    
    							document.forms.eventform.eventlist.value = theevent;
    						}
    					} else if ((events[i][1] == month) && (floater == day)) {
    						theevent += "Events of: \n" + month +'/'+ day +'/'+ year + '\n';
    						theevent += events[i][6] + '\n';
    						theevent += '\n -------------- \n\n';
    						theevent += 'Start Time: ' + events[i][4] + '\n';
    						theevent += 'Ending Time: ' + events[i][5] + '\n';
    						theevent += '\n -------------- \n\n';
    						theevent += 'Description: ' + events[i][7] + '\n';
    
    						document.forms.eventform.eventlist.value = theevent;
    					}
    				}
    		}
    		}
    		// Now we'll process any One Time events happening on the matching month, day, year:
    		else if ((events[i][2] == day) && (events[i][1] == month) && (events[i][3] == year)) {
    			theevent += "Events of: \n" + month +'/'+ day +'/'+ year + '\n';
    			theevent += events[i][6] + '\n';
    			theevent += '\n -------------- \n\n';
    			theevent += 'Start Time: ' + events[i][4] + '\n';
    			theevent += 'Ending Time: ' + events[i][5] + '\n';
    			theevent += '\n -------------- \n\n';
    			theevent += 'Description: ' + events[i][7] + '\n';
    			document.forms.eventform.eventlist.value = theevent;
    		}
    	}
    	if (theevent == "") document.forms.eventform.eventlist.value = 'No events to show.';
    }
    
    
    function floatingholiday(targetyr,targetmo,cardinaloccurrence,targetday) {
    // Floating holidays/events of the events.js file uses:
    //	the Month field for the Month (here it becomes the targetmo field)
    //	the Day field as the Cardinal Occurrence  (here it becomes the cardinaloccurrence field)
    //		1=1st, 2=2nd, 3=3rd, 4=4th, 5=5th, 6=6th occurrence of the day listed next
    //	the Year field as the Day of the week the event/holiday falls on  (here it becomes the targetday field)
    //		1=Sunday, 2=Monday, 3=Tuesday, 4=Wednesday, 5=Thurday, 6=Friday, 7=Saturday
    //	example: "F",	"1",	"3",	"2", = Floating holiday in January on the 3rd Monday of that month.
    //
    // In our code below:
    // 	targetyr is the active year
    // 	targetmo is the active month (1-12)
    // 	cardinaloccurrence is the xth occurrence of the targetday (1-6)
    // 	targetday is the day of the week the floating holiday is on
    //		0=Sun; 1=Mon; 2=Tue; 3=Wed; 4=Thu; 5=Fri; 6=Sat
    //		Note: subtract 1 from the targetday field if the info comes from the events.js file
    //
    // Note:
    //	If Memorial Day falls on the 22nd, 23rd, or 24th, then we add 7 to the dayofmonth to the result.
    //
    // Example: targetyr = 2052; targetmo = 5; cardinaloccurrence = 4; targetday = 1
    //	This is the same as saying our floating holiday in the year 2052, is during May, on the 4th Monday
    //
    var firstdate = new Date(String(targetmo)+"/1/"+String(targetyr));	// Object Storing the first day of the current month.
    var firstday = firstdate.getUTCDay();	// The first day (0-6) of the target month.
    var dayofmonth = 0;	// zero out our calendar day variable.
    
    	targetday = targetday - 1;
    
    	if (targetday >= firstday) {
    		cardinaloccurrence--;	// Subtract 1 from cardinal day.
    		dayofmonth = (cardinaloccurrence * 7) + ((targetday - firstday)+1);
    	} else {
    		dayofmonth = (cardinaloccurrence * 7) + ((targetday - firstday)+1);
    	}
    return dayofmonth;
    }
    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];}
    }
    </script>

    This is in the Body:
    Code:
    <table id="evtcal" border="0" cellpadding="0" cellspacing="0" width="584">
    	<tbody>
    		<tr>
    			<td width="314" height="228" align="center" valign="top" bgcolor="#ffffff" style="padding: 3px;">
    				<div id="calendar"><!--  Dynamically Filled --></div>
    				<span class="style11 style20"><b>Instructions:</b> Click a highlighted date on the calendar and its events will appear in the box to the right. You can move to a different month or year by clicking on the buttons above the calendar.</span></td>
    			<td width="10">&nbsp;</td>
    			<td style="padding: 3px;" align="center" bgcolor="#dbf3f3" valign="top" width="260"><center><b><u>Events</u></b>
    				<form id="eventform" name="eventform" action="#" method="get">
    				  <textarea name="eventlist" cols="25" rows="20" wrap="soft">Click a date on the calendar to view its events here.</textarea>
    				</form>
    				</center>			</td>
    		</tr>
    	</tbody>
    </table>
    Last edited by violetmesses; 06-03-2009 at 05:22 PM. Reason: Woops! Did not put in the [CODE][/CODE] tags.

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Please edit your post and add [CODE][/CODE] tags around the posted code to help us to read your post.

    Add return false; after the onclick event handler call, like
    Code:
    <a onclick="changedate('prevyr'); return false;" onmouseout="document.PrevYr.src='images/PrevYrOff40x40.jpg';" onmouseover="document.PrevYr.src='images/PrevYrOn40x40.jpg';" href="#"><img width="40" height="40" border="0" alt="Prev Yr" src="images/PrevYrOff40x40.jpg" name="PrevYr"/></a>
    for all those buttons.
    Last edited by abduraooft; 06-03-2009 at 08:34 AM.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Jun 2009
    Location
    California
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile You are the best.

    Quote Originally Posted by abduraooft View Post
    Please edit your post and add [CODE][/CODE] tags around the posted code to help us to read your post.

    Add return false; after the onclick event handler call, like
    Code:
    <a onclick="changedate('prevyr'); return false;" onmouseout="document.PrevYr.src='images/PrevYrOff40x40.jpg';" onmouseover="document.PrevYr.src='images/PrevYrOn40x40.jpg';" href="#"><img width="40" height="40" border="0" alt="Prev Yr" src="images/PrevYrOff40x40.jpg" name="PrevYr"/></a>
    for all those buttons.
    Thanks sooo much! I really appreciate your help.

    Sincerely,
    vm


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •