fotoprojekt - test

Fotoprojekt - einBLICK .st0{fill:#A24B46; z-index: 10;} .st0:hover{fill:#ec008c; z-index: 10;} .st1{fill:#FFFFFF; z-index: 9;} .st2{fill:#A34B47;} .st2:hover{fill:#ec008c;} .st3{z-index: 11;} .st4{z-index: 12;} .st5{z-index: 13;} .button {fill: #449ed3;stroke:#0C2C84;stroke-width: 0.5;stroke-miterlimit: 6;stroke-linecap: round;} .compass {fill: #fff;stroke: #000;stroke-width: 1; } .button {fill: #225EA8;stroke: #0C2C84;stroke-width: 0.5;stroke-miterlimit:6;stroke-linecap: round;} .button:hover {stroke-width: 1;} .plus-minus {fill: #fff;pointer-events: none;} .static {cursor: not-allowed;} .draggable, .draggable-group {cursor: move;} .nulleins:hover {fill: #ec008c;opacity: 1;} .heyo:hover{ fill: #CC2929; +transition(0.3s); } .enabled{fill: #21669E; cursor: pointer; } .description{ pointer-events: none; position: absolute; font-size: 18px; text-align: center; background: white; padding: 10px 15px; z-index: 5; height: 30px; line-height: 30px; margin: 0 auto; color: #21669e; border-radius: 5px; box-shadow: 0 0 0 1px #eee; +transform(translateX(-50%)); display: none; &.active display: block; &:after content: ''; position: absolute; left: 50%; top: 100%; width: 0; height: 0; margin-left: -10px; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid white; } #tooltip { dominant-baseline: hanging; } .w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before .w3-display-container:hover .w3-display-hover{display:block}.w3-display-container:hover span.w3-display-hover{display:inline-block}.w3-display-hover{display:none} .w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px} .w3-modal{z-index:100;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)} .w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px} @media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}.w3-modal{padding-top:30px} .w3-dropdown-hover.w3-mobile .w3-dropdown-content,.w3-dropdown-click.w3-mobile .w3-dropdown-content{position:relative} .w3-hide-small{display:none!important}.w3-mobile{display:block;width:100%!important}.w3-bar-item.w3-mobile,.w3-dropdown-hover.w3-mobile,.w3-dropdown-click.w3-mobile{text-align:center} .w3-dropdown-hover.w3-mobile,.w3-dropdown-hover.w3-mobile .w3-btn,.w3-dropdown-hover.w3-mobile .w3-button,.w3-dropdown-click.w3-mobile,.w3-dropdown-click.w3-mobile .w3-btn,.w3-dropdown-click.w3-mobile .w3-button{width:100%}} @media (max-width:768px){.w3-modal-content{width:500px}.w3-modal{padding-top:50px}} @media (min-width:993px){.w3-modal-content{width:900px}.w3-hide-large{display:none!important}.w3-sidebar.w3-collapse{display:block!important}} .w3-teal,.w3-hover-teal:hover{color:#fff!important;background-color:#009688!important} .w3-text-teal,.w3-hover-text-teal:hover{color:#009688!important} .w3-border-teal,.w3-hover-border-teal:hover{border-color:#009688!important} .w3-btn,.w3-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap} .w3-btn,.w3-button{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} .w3-disabled,.w3-btn:disabled,.w3-button:disabled{cursor:not-allowed;opacity:0.3}.w3-disabled *,:disabled *{pointer-events:none}; .w3-dropdown-hover:hover > .w3-button:first-child,.w3-dropdown-click:hover > .w3-button:first-child{background-color:#ccc;color:#000} .w3-bar-block .w3-dropdown-hover .w3-button,.w3-bar-block .w3-dropdown-click .w3-button{width:100%;text-align:left;padding:8px 16px} .w3-bar .w3-button{white-space:normal} .w3-dropdown-hover.w3-mobile,.w3-dropdown-hover.w3-mobile .w3-btn,.w3-dropdown-hover.w3-mobile .w3-button,.w3-dropdown-click.w3-mobile,.w3-dropdown-click.w3-mobile .w3-btn,.w3-dropdown-click.w3-mobile .w3-button{width:100%}} .w3-button:hover{color:#000!important;background-color:#ccc!important} .w3-display-topleft{position:absolute;left:0;top:0}.w3-display-topright{position:absolute;right:0;top:0} svg.addEventListener('mouseup', endDrag); svg.addEventListener('touchstart', startDrag); svg.addEventListener('touchmove', drag); svg.addEventListener('touchend', endDrag); svg.addEventListener('touchleave', endDrag); svg.addEventListener('touchcancel', endDrag); function getMousePosition(evt) { var CTM = svg.getScreenCTM(); if (evt.touches) { evt = evt.touches[0]; } return { x: (evt.clientX - CTM.e) / CTM.a, y: (evt.clientY - CTM.f) / CTM.d }; } var selectedElement, offset, transform; function initialiseDragging(evt) { offset = getMousePosition(evt); // Make sure the first transform on the element is a translate transform var transforms = selectedElement.transform.baseVal; if (transforms.length === 0 || transforms.getItem(0).type !== SVGTransform.SVG_TRANSFORM_TRANSLATE) { // Create an transform that translates by (0, 0) var translate = svg.createSVGTransform(); translate.setTranslate(0, 0); selectedElement.transform.baseVal.insertItemBefore(translate, 0); } // Get initial translation transform = transforms.getItem(0); offset.x -= transform.matrix.e; offset.y -= transform.matrix.f; } function startDrag(evt) { if (evt.target.classList.contains('draggable')) { selectedElement = evt.target; initialiseDragging(evt); } else if (evt.target.parentNode.classList.contains('draggable-group')) { selectedElement = evt.target.parentNode; initialiseDragging(evt); } } function drag(evt) { if (selectedElement) { evt.preventDefault(); var coord = getMousePosition(evt); transform.setTranslate(coord.x - offset.x, coord.y - offset.y); } } function endDrag(evt) { selectedElement = false; } } $description = $(".description"); $('.enabled').hover(function() { $(this).attr("class", "enabled heyo"); $description.addClass('active'); $description.html($(this).attr('id')); }, function() { $description.removeClass('active'); }); $(document).on('mousemove', function(e){ $description.css({ left: e.pageX, top: e.pageY - 70 }); }); ]]> --> Tooltip function pan(dx, dy) { transformMatrix[4] += dx; transformMatrix[5] += dy; var newMatrix = "matrix(" + transformMatrix.join(' ') + ")"; matrixGroup.setAttributeNS(null, "transform", newMatrix); } function zoom(scale) { for (var i = 0; i < 4; i++) { transformMatrix[i] *= scale; } transformMatrix[4] += (1 - scale) * centerX; transformMatrix[5] += (1 - scale) * centerY; var newMatrix = "matrix(" + transformMatrix.join(' ') + ")"; matrixGroup.setAttributeNS(null, "transform", newMatrix); } 01 Centgasse und Centturm × Centgasse und Centturm

Slide

Centgasse 1945