I would like to find a small calendar that I can use to allow people to choose a date. I am planning on placing a small icon to the right of my date fields to allow people to choose the date from a calendar. It doesn't need to be full sized. I'm using ASP for scripting, but a control is an option (com or activex).
View 2 RepliesI wanted a small calendar for a web page that is created for the current month and highlights the current day and a date passed in. I also added a variable to show text when the cursor is over the highlighted dates. It's nothing special, but I like it and thought I'd share it. Here is the code and it is attached for downloading as well.
Let me know what you think of it.
<html>
<head>
<title>Calendar</title>
<script type="text/javascript">
var month = ["January","February","March","April","May","June","July","August","September","October","November","December"];
var moDays= [31,28,31,30,31,30,31,31,30,31,30,31];
function display(d,txt) {
var highlightDate = new Date(Date.parse(d));
var flag = false;
var startDate = new Date();
startDate.setDate(1);
if (new Date(startDate.getFullYear(),1,29).getDate() == 29) moDays[1] = 29;
var endDate = new Date();
endDate.setDate(moDays[endDate.getMonth()]);
if (highlightDate >= startDate && highlightDate <= endDate) flag = true;
if (!txt) txt = "";
var start = 0 - startDate.getDay();
var end = endDate.getDate() + (7 - endDate.getDay());
var r = document.getElementById('calendar').insertRow(0);
for (i = start; i < end; i++) {
if ((i - start - 1) % 7 == 0 && i != start) {
r = document.getElementById('calendar').insertRow(-1);
r.className = 'newRow'
}
var c = r.insertCell(-1);
if (i > 0 && i <= endDate.getDate()) {
c.innerHTML = i;
if (i == new Date().getDate()) {
c.title = 'Today'
c.className = 'selectedCell'
} else {
c.className = 'newCell'
}
if (flag && i == highlightDate.getDate()) {
c.title = txt;
c.className += ' highlightedCell'
}
} else {
c.innerHTML = ' '
c.className = 'hiddenCell'
}
}
var title = document.getElementById('calendar').rows[0].cells[0];
title.innerHTML = month[startDate.getMonth()] + ' ' + startDate.getFullYear();
title.colSpan = 7;
title.className = 'title'
}
</script><style type="text/css">
#calendar {
position: absolute;
color: navy;
font: italic 75% sans-serif;
margin: 2px;
padding: 1px;
background-color: lightcyan;
border: 1px solid gray;
}
TR.newRow {
background-color: white;
}
TD.newCell {
text-align: right;
margin: 1px;
padding: 2px;
border-right: 1px solid lightskyblue;
border-bottom: 1px solid lightskyblue;
}
TD.selectedCell {
background-color: cyan;
text-align: right;
margin: 1px;
padding: 2px;
border-right: 1px solid lightskyblue;
border-bottom: 1px solid lightskyblue;
}
TD.hiddenCell {
background-color: lightcyan;
}
TD.title {
font: bold 110% sans-serif;
text-align: center;
border-bottom: 1px solid skyblue;
}
TD.highlightedCell {
background-color: palegoldenrod;
}
</style>
</head>
<body onload="display(ཁ/25/2006','Adam's Birthday');">
<table id="calendar"></table>
</body>
</html>
how forum's get divs to popup once they click a link? Like the "Quick Links" in sitepoint's navigation.
View 15 Replies View RelatedWhat I am kooking for is not really a pop-up but more like a tool-tip. I was not sure what else to call it. What I need is a small little area with a different background color and perhaps a border to open next to a word when the symbol next to it is clicked on. This word or phrase would be in a sentence that would require some further explanation or definition.
I guess this would be similar to how someone like iStock Photo does with their thumbnails only it will require a click as opposed to a rollover and it will not be an image, just some text.
I want to have a 'help' popup on seveal key words on a page.
I don't want to use a button...
But would like to do it like a link... so the text on the page is the link
to the Popup Window.
Can anyone provide me with a simple example of a JavaScript to do this.
I'm trying this and it has no titlebar, but shows the calendar on a full page.
<a
href="javascript:calendar_window=window.open('cal.aspx?f ormname=aspnetForm.<%=
ChargeFormView.FindControl("StartDate_date").ClientID
%>','calendar_window','width=180,height=130,left=500 ,top=300,titlebar=no,fullscreen=yes');calendar_win dow.focus()">
If I remove fullscreen=yes, I get a nice small window but with a titlebar.
I want to resize the dialog/popup box that appears as datepicker. How can I make the size smaller than what it comes as default size? I have to navigate on the dates using arrow keys. How it is possible to implement.
View 4 Replies View RelatedI need to disable the first 3 days of a popup calendar so that users can only select a date which is 3 days in advance to the present date. I dont really know javascript. Calendar code can be found below.
[Code]...
That's right folks, it's your favorite noob again. I am working on a popup calendar, and it is almost finished. The problem I am running into, is there seems to be an infinite llop somewhere in the cell creation. i have attached a snippet of the popup calendar as it currently is produced. As usual, I have spent the requisite 2 hours staring at my code. I found a few things, but I am now stumped.Here is my code, let me know what you see.
<!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.0 TransitionalEN" "http:www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http:www.w3.org/1999/xhtml">
[code]....
I have 2 different pages. one is where i will set the generic settings for golf course. the other is a reservations page which provides an option to add new reservation page. Now in the settings page i can set no of days to 1 thru 5. it will be inserted into config table in database. Based on this, on reservation page, i need to show only 1 or 2 or 5 days on the popup calendar starting from today which allows to select one while making new reservation.based on the setting if i can prepopulate those dates in a drop down list on the addreservation.php
View 5 Replies View RelatedI'm looking for a date picker that I can use in a form that has multiple date fields. Does anyone know of one that can handle this?
View 1 Replies View RelatedIf the screen resolution is small enough, or the window is small enough the calendar that appears when a user clicks the textbox for the datepicker appears on top of the textbox - usually it appears below.
I have some text links at the top-right of my page, and if the window is small enough, the datepicker calendar goes underneath these text links.
Is there a way to have the popup calendar ALWAYS on top of every element on the page? If not, is there a way to have the datepicker popup calendar ALWAYS appear below the textbox?
I am using jQuery (wdCalendar) Scheduler Calendar in my Website. I want to show Popup moduler of Add/Edit Event Form at the right top position of the window. But There is no functionality to change position of popupdialog.
View 1 Replies View RelatedI'm trying to get Xin's Popup Calendar -- [url]-- to work with the following form:
I need the dates to fill the month select field, the year select field, and the date text field but I cannot understand how to do this, I'm very new at javascript.
I am trying to fix permission denied error on a popup calendar in my page. Infact this functionality works with Netscap + PKI Certificate but this functionality not works with IE + PKI certificate. Without PKI certificate it is works fine with IE. With PKI certificate when I click on calander image i get "Permission Denied" error but it display the calander after when I select the date it change the data in the data field but calander do not close and throw another error "top.newWin is null or not an object".
[Code]....
The following code is working fine only in IE. when i click on the calender img, calender window is not coming up in firefox/chrome.
[Code]....
have a small div above (hover) a big one.I assign onmouseover and onmouseout events to the wrapper div.For image caption roll-over animation.The problem is when the mouse is above the caption itself, causing an unwanted result(probably event bubbling).
And another problem: sometimes when you move mouse from outside to container you get a a triple debug sequence: (it should be just 2): -I am over- -I am out- -I am over-(firebug console)How to make it work? (no jquery)must work on all browsers.[URL]The wanted result:When mouse moved over the image, only mouseover event should be raised once!When mouse moved out from the image, only the mouseout event should be raised.when mouse is over the captionm it should be treated as if the mouse is still on the image. (no flickering)
I'm very new to JQ, I was looking for a solution to expand a div on mouse hover from its center to display some dynamic text wrapped in a code tag, I found and tried to fit to my needs this little piece of code, however is not exactly what I'm trying to do.
[Code]...
Can someone tell me why the image isn't zoomed all the way to its max when clicked on? You have to click on the zoomed image to get it to its max dimensions. Why does it do this and how do I fix it so it will max out in a separate window when you click on the thumb? Code:
View 2 Replies View RelatedI have this website here [URL] If I use PC, I can drag and change volume on top left just fine. But if I use Mac OSX, either Safari or Firefox, I cannot drag the volume in the Flash, although I can see the mouse turn into pointer.
Where is the SWF: [URL]
I have an "image gallery". I have four links that go to external pages, not defined yet, and one main image. When rolling over each link, the main image should change to the corresponding one. When I take the javascript and meat of the html out of context it works. When I use it on this page where it is supposed to be used, it does not work. The error console tells me my functions (switch_One() etc.) are not defined. Code:
View 3 Replies View RelatedThe following function is called when the user selects "other" from a drop down menu (<OPTION>).
IE it works great, in Firefox I get the following error:
Ele1 is undefined
- Ele1.removeChild(Ele0);
Code:
function buildTextBox() {
var Ele0 = document.getElementById("LAC_Littmann.color");
Ele0.innerHTML = "";
var Ele1 = Ele0.parentElement;
[Code]....
What i am trying to do is the following: I read a tutorial on objects and thought i would try it out. The tutorial taught me how to make a function calculating the areal and circumspherence of the circle where the user input would be the radius.
To sum up: I want to make it possible for the user to write, say, "2" in the form text field and click "Calculate" and then the text will appear w/o reloading the page. I could easily do this by removing the objects but as i am training my object skills i would like to know if it is possible to do this with objects?
The problem is that i dont know how to take the user input. I know that in PHP it is "$_POST["name"]" but what is it in JS? And is it possible to jump into PHP and use $_POST inside the JS script or how can this be done?
This is my code so far (It prolly looks strange but i really dont know how to get it to work).
<script type="text/javascript">
function Circle(radius){
this.radius = radius;
this.getArea = function(){
[Code]....
As you can see i have a predefined object: bigCircle. What i want to do is change the new Circle(100) to new Circle(USER INPUT HERE).
i made this javascript using the new "screen.width" property, which would make it easy to center content in a webpage no matter what the screen resolution is. Here it goes:
<html>
<head>
<script type="text/javascript">
function pos_center() {
var content = document.getElementById("carrier")
var width = screen.width
var contentwidth = content.offsetWidth
value = parseFloat((width - contentwidth)/2)
content.style.marginLeft = value }
</script>
</head>
<body
<div class="body" id="carrier">
</div>
</body>
</html>
The "body onload" makes the page first load all the way to the left, and then after completely loading switches the content to the center, that is dynamically gross.
Now, instead of using the "body onload", is there any other way that i can make the content appear. Seeing that there is no "onbeforeload", there must be another way to solve this.
Hoping someone could solve this small problem of mine. I have numerous regions on a page that can be hidden/shown, the problem is i get a 'Line 8 Character 30 'id' is not defined' javascript browser error, but it works!
here is the code the error appears in:
PHP Code:
<script language="javascript" type="text/javascript">
/* This goes in the head section */
window.onload = function() { document.getElementById(id).style.display = 'none' }
function toggle(link, id) {
var div = document.getElementById(id);
if (div.style.display == 'none') {
div.style.display = 'block'
link.innerHTML = 'Hide Forms'
} else {
div.style.display = 'none'
link.innerHTML = 'Show Forms'
}
}
</script>
The code for the hide/show region is below.
PHP Code:
[ <a href="#id3" onclick="toggle(this, 'id3'); return false;">Show Forms</a> ]</div>
<div id="id3" style="padding: 10px; display: none;">
SHOW/HIDE CONTENT HERE!
</div>
How would I make this into one Loop using all same variables? Right now I can only get his program to work with separate loops
Here is the Coding
script type="text/javascript">
for (var i=0; i<date.length; i++){
document.write("<td>"+date[i]+"</td>");}
</script>
[Code]...