eKiwi.de - Online HTML Editor

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Kontakt</title>
    <meta name="generator" content="DA-Formmaker 4.13.5">
    
    <link rel="stylesheet" href="https://www.w3schools.com/lib/w3.css">
    <script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
    <script src="https://code.jquery.com/ui/1.11.2/jquery-ui.min.js"></script>
    
    <style type="text/css">
        body { background-color:#ffffff;}
h1 { color:#2196f3; font-family:Segoe UI,Arial,sans-serif; font-size:30pt; }
p { color:#000000; font-family:Segoe UI,Arial,sans-serif; font-size:12pt; }

/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
	cursor: default !important;
}

/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
	display: block;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
}

/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ui-datepicker {
	width: 17em;
	padding: .2em .2em 0;
	display: none;
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 2px;
	width: 1.8em;
	height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 2px;
}
.ui-datepicker .ui-datepicker-next {
	right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 1em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 45%;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker-week-end,
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	color: #000000;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-align: right;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}

/* icon support */
.ui-menu-icons {
     position: relative;
}
.ui-menu-icons .ui-menu-item {
     padding-left: 2em;
}

/* left-aligned */
.ui-menu .ui-icon {
     position: absolute;
     top: 0;
     bottom: 0;
     left: .2em;
     margin: auto 0;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
     left: auto;
     right: 0;
}

/* Component containers
----------------------------------*/
.ui-widget {
     font-family: Arial,Helvetica,Geneva; /*FONTCAL*/
}
.ui-widget .ui-widget {
     font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
     font-family: Arial,Helvetica,Geneva; /*FONTCAL*/
     font-size: 1em;
}
.ui-widget-content {
     border: 1px solid #000000; /*BORDERCAL*/
     background: #EEEEEE; /*BGCAL*/
     color: #000000; /*TEXTCAL*/
}

.ui-widget-header {
     border: 1px solid #000000;
     background: #CCCCCC;/*BGHEADINGCAL*/
     color: #000000;
     font-weight: normal;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
     border: 1px solid #000000; /*FONTCAL*/
     background: #B6CDE9; /*BGDAYCAL*/
     font-weight: normal;
     color: #000000;/*TEXTCAL*/
}

/* Misc visuals
----------------------------------*/

/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
     border-top-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
     border-top-right-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
     border-bottom-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
     border-bottom-right-radius: 4px;
}

/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
     width: 16px;
     height: 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
     background-image: url("https://code.jquery.com/ui/1.11.2/themes/smoothness/images/ui-icons_222222_256x240.png");
}
.ui-widget-header .ui-icon {
     background-image: url("https://code.jquery.com/ui/1.11.2/themes/smoothness/images/ui-icons_222222_256x240.png");
}

.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
     background-image: url("https://code.jquery.com/ui/1.11.2/themes/smoothness/images/ui-icons_454545_256x240.png");
}
.ui-state-active .ui-icon {
     background-image: url("https://code.jquery.com/ui/1.11.2/themes/smoothness/images/ui-icons_454545_256x240.png");
}

/* positioning */
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
	/*border: 1px solid #999999;*/
	border: 1px solid #000000;
	font-weight: normal;
	color: #212121;
}

.ui-datepicker-unselectable .ui-state-default {
    background: yellow;
    color: red;
}

div.ui-datepicker{
	font-family: Arial,Helvetica,Geneva;
	font-size:10px;
}

/* Landscape phones and down */
        @media (max-width: 480px) {
            .mainContainer

{
            width: 100%;
        }

}

@media (min-width: 768px) {
            .mainContainer {
                width: 80%;
                margin-left: auto;
                margin-right: auto;
            }
        }

.internal {
            display: none;
        }

</style>

function str_replace(search, replace, subject) {
	return subject.split(search).join(replace);
}
    </script>

function SetCookieValues() {
      
}

function SetCookies() {
        
}

</script>

return true;
}
</script>

</head>
<body onLoad="SetCookieValues();">
  
<div class="w3-card-12 w3-white mainContainer">
  
  <div class="w3-container w3-sand">
      <h1>Kontakt</h1>
  </div>

<div class="w3-container" id="daf-37393">
	<p>
	<label>Kalender</label>
	<input class="w3-input w3-white" type="text" name="Kalender" id="Kalender" value="">
		</p>
</div>

<div class="w3-row">
  <div class="w3-col m6">
    <div class="w3-container">
      <p>
      <button type="submit" class="w3-btn w3-blue-grey">Absenden</button>     
      <button type="reset" class="w3-btn w3-red">ZurÃ¼cksetzen</button>
      
      </p>
    </div>
  </div>
  <div class="w3-col m6">
    <div style="text-align: right;" class="w3-container">
      <p>
      
      
      </p>
    </div>
  </div>
</div>

</form>

</div>

function openDialog(nameDialog, idOfButton)
  {
    var rect = document.getElementById(idOfButton).getBoundingClientRect();

var paddingTop = 100;
    var newPaddingTop = rect.top - 200;
    if (newPaddingTop < paddingTop)
    {
      newPaddingTop = paddingTop;
    }

document.getElementById(nameDialog).style.display='block';

if (inIframe())
    {
      document.getElementById(nameDialog).style.paddingTop=newPaddingTop + 'px';
    }
  }
</script>

$(document).ready(function () {
    var startDate = new Date();
startDate.setDate(startDate.getDate() + 0 );

$('#Kalender').datepicker({
       prevText: '<zurÃ¼ck', prevStatus: '',
        prevJumpText: '<<', prevJumpStatus: '',
        nextText: 'weiter>', nextStatus: '',
        nextJumpText: '>>', nextJumpStatus: '',
        currentText: 'heute', currentStatus: '',
        todayText: 'heute', todayStatus: '',
        clearText: '-', clearStatus: '',
        closeText: 'schlieÃŸen', closeStatus: '',
        monthNames: ['Januar','Februar','MÃ¤rz','April','Mai','Juni',
'Juli','August','September','Oktober','November','Dezember'],
        monthNamesShort: ['Jan','Feb','Mrz','Apr','Mai',
'Jun','Jul','Aug','Sep','Okt','Nov','Dez'],
        dayNames: ['Sonntag','Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag'],
        dayNamesShort: ['So','Mo','Di','Mi','Do','Fr','Sa'],
        dayNamesMin: ['So','Mo','Di','Mi','Do','Fr','Sa'],
        showMonthAfterYear: false,
        changeMonth: true,
        changeYear: true,
        beforeShowDay: function(d) {
            return [!(d.getDay()==0||d.getDay()==6)]
        },
        minDate: startDate,
        yearRange: "2022:2026",   
        dateFormat:'dd.mm.yy'
    } 
  );

});
</script>

</body>
</html>

Ausführen Kopieren Speichern