MediaWiki:Centralnotice-template-Leichte Sprache Banner Apple: Unterschied zwischen den Versionen

Aus Hurraki - Wörterbuch für Leichte Sprache
Wechseln zu: Navigation, Suche
 
(11 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 3: Zeile 3:
 
<br>
 
<br>
 
<br>
 
<br>
<html>
 
  <head>
 
    <style>
 
  #centralNotice.collapsed #{{{banner}}}{
 
    display: none;
 
  }
 
  div#{{{banner}}} {
 
    background: transparent;
 
    display: none;
 
    font-family: Arial, Helvetica, Verdana, sans-serif;
 
    left: 0;
 
    position: fixed;
 
    top: 0;
 
    width: 100%;
 
    z-index: 9999;
 
  }
 
  #{{{banner}}}-form-wrapper {
 
    background: #eef0fc;
 
    box-shadow: 3px 0 5px rgba(0, 0, 0, 0.5);
 
    padding: 4px 8px;
 
  }
 
  #{{{banner}}}-form {
 
    height: 100%;
 
  }
 
  #{{{banner}}}-form table {
 
    border: none;
 
    border-collapse: collapse;
 
    width: 100%;
 
    height: 100%;
 
  }
 
  #{{{banner}}}-form td {
 
    font-size: 12px;
 
    font-weight: bold;
 
    min-width: 55px;
 
    white-space: nowrap;
 
    margin: 0;
 
    vertical-align: middle;
 
    padding: 2px;
 
  }
 
  #{{{banner}}}-form span label {
 
    margin-left: 2px;
 
  }
 
  #{{{banner}}}-form .amount-options {
 
    height: 20%;
 
  }
 
  #{{{banner}}}-form .paymentmethod-options td {
 
    text-align: center;
 
    padding: 4px 4px 8px 4px;
 
  }
 
  #{{{banner}}}-form button {
 
    cursor: pointer;
 
    display: inline-block;
 
    font-weight: bold;
 
    width: 110px;
 
    border: 3px double #ddd;
 
    border-radius: 8px;
 
    background: #ffffff; /* Old browsers */
 
    background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* FF3.6+ */
 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
 
    background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* Chrome10+,Safari5.1+ */
 
    background: -o-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* Opera 11.10+ */
 
    background: -ms-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* IE10+ */
 
    background: linear-gradient(to bottom, #ffffff 0%,rgb(240, 240, 240) 100%);
 
    box-shadow: 0 1px 1px #ddd;
 
    margin: 0 1px;
 
  }
 
  #{{{banner}}}-form button:hover {
 
    color: #0645ad;
 
  }
 
  div#{{{banner}}} #{{{banner}}}-facts {
 
    background: #ffcc00 url(//upload.wikimedia.org/wikipedia/donate/c/c0/Information-icon.png) no-repeat 10px 8px;
 
    min-height: 65px;
 
    padding: 0;
 
    position: relative;
 
    width: 100%;
 
    border: none;
 
    border-collapse: collapse;
 
  }
 
  div#{{{banner}}} #{{{banner}}}-facts p {
 
    color: #000;
 
    font-size: 13px;
 
    font-weight: bold;
 
    line-height: 16px;
 
    margin: 0;
 
    padding: 10px 10px 10px 40px;
 
    text-align: justify;
 
  }
 
 
  div#{{{banner}}} p#{{{banner}}}-legal {
 
    font-family: Arial, Helvetica, Verdana, sans-serif;
 
    position: relative;
 
    margin: 0;
 
    padding: 10px 40px 10px 40px;
 
    font-size: 13px;
 
    line-height: 16px;
 
    font-weight: normal;
 
    z-index: -10;
 
    background: #ffcc00;
 
    top: -100px;
 
    text-align: center;
 
  }
 
 
  #{{{banner}}}-close-wrapper {
 
    width: 20px;
 
  }
 
 
  div#{{{banner}}} span#{{{banner}}}-close {
 
    background: url(//upload.wikimedia.org/wikipedia/donate/2/27/Small-white-close.png) no-repeat center center;
 
    background-color: black;
 
    cursor: pointer;
 
    display: block;
 
    height: 21px;
 
    position: absolute;
 
    right: 0px;
 
    top: 0px;
 
    width: 21px;
 
  }
 
  div#{{{banner}}} #{{{banner}}}-facts p b {
 
    background: yellow;
 
    color: black;
 
    padding: 1px 0.5em;
 
  }
 
  .interval-hidden {
 
    display: none;
 
  }
 
  div#{{{banner}}} span.btext-highlight {
 
    background: yellow;
 
    color: black;
 
    padding: 1px 0.5em;
 
  }
 
</style> </head>
 
  <body>
 
    <div id="{{{banner}}}">
 
      <div style="box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);">
 
        <table id="{{{banner}}}-facts" style="height: 100%;">
 
          <!-- table height must be defined for height 100% to work on elements within it -->
 
          <tbody>
 
            <tr>
 
              <td>
 
                <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed
 
                  diam nonumy eirmod tempor invidunt ut labore et dolore magna
 
                  aliquyam erat, sed diam voluptua. At vero eos et accusam et
 
                  justo duo dolores et ea rebum. Stet clita kasd gubergren, no
 
                  sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem
 
                  ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
 
                  nonumy eirmod tempor invidunt ut labore et dolore magna
 
                  aliquyam erat, sed diam voluptua. At vero eos et accusam et
 
                  justo duo dolores et ea rebum. Stet clita kasd gubergren, no
 
                  sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
 
              </td>
 
              <td id="{{{banner}}}-form-wrapper">
 
                <table>
 
                  <tbody>
 
                    <tr class="interval-options interval-hidden">
 
                    </tr>
 
                    <tr class="interval-options interval-hidden">
 
                    </tr>
 
                    <tr>
 
                      <td colspan="4" style="height: 1px;"><br>
 
                      </td>
 
                    </tr>
 
                    <tr class="amount-options">
 
                      <td colspan="4"><br>
 
                        <form action="https://www.paypal.com/cgi-bin/webscr" method="post"
 
                          target="_top"> <input name="cmd" value="_s-xclick" type="hidden">
 
                          <input name="hosted_button_id" value="PJZZZMESJX5Z2" type="hidden">
 
                          <input src="https://www.paypalobjects.com/de_DE/DE/i/btn/btn_donate_LG.gif"
 
                            name="submit" alt="Jetzt einfach, schnell und sicher online bezahlen – mit PayPal."
 
                            type="image" border="0"> <img alt="" src="https://www.paypalobjects.com/de_DE/i/scr/pixel.gif"
 
                            width="1" height="1" border="0"> </form>
 
                      </td>
 
                    </tr>
 
                    <tr class="amount-options">
 
                      <td colspan="4"><br>
 
                      </td>
 
                    </tr>
 
                    <tr>
 
                    </tr>
 
                  </tbody>
 
                </table>
 
                <input name="periode" id="periode" value="" type="hidden"> <input
 
                  id="form-page" name="form" value="Formularseite2-Lastschrift"
 
                  type="hidden"> <input id="wikilogin" name="wikilogin" value="no"
 
                  type="hidden"> <input id="impCount" name="impCount" value=""
 
                  type="hidden"> <input id="bImpCount" name="bImpCount" value=""
 
                  type="hidden"> </td>
 
              <td id="{{{banner}}}-close-wrapper"> <span id="{{{banner}}}-close">&nbsp;</span>
 
              </td>
 
            </tr>
 
          </tbody>
 
        </table>
 
      </div>
 
      <p id="{{{banner}}}-legal"> <strong style="color: #0078FF;">Spendenkonto:</strong>
 
        Hep Hep Hurra e.V. - IBAN <strong style="color: #0078FF">DE16 8306 5408 0004 0646 40  </strong>
 
        - BIC <strong style="color: #0078FF">GENODEF1SLR </strong> </p>
 
    </div>
 
    <script type="text/javascript">
 
$( document ).ready( function() {
 
  $('body').prepend($('#centralNotice'));
 
 
  var impCount = increaseImpCount();
 
  $("#impCount").val(impCount);
 
  var bannerImpCount = increaseBannerImpCount();
 
  $("#bImpCount").val(bannerImpCount);
 
 
  setTimeout( addBannerSpace, 15000 );
 
  if(wgUserName !== null) $('#wikilogin').val('yes');
 
  $(window).resize(function() {
 
    //addBannerSpace();
 
  });
 
 
  $( ".send" ).click( function( e ) {
 
    return validateForm();
 
  });
 
 
  $('#{{{banner}}}-close').click(function() {
 
    hideBanner();
 
    removeBannerSpace();
 
    return false;
 
  });
 
 
  $('#{{{banner}}}').mouseenter(function() {
 
    $('p#{{{banner}}}-legal').clearQueue().animate({
 
      top: '0px'
 
    });
 
  });
 
  $('#{{{banner}}}').mouseleave(function() {
 
    $('p#{{{banner}}}-legal').animate({
 
      top: '-100px'
 
    });
 
  });
 
});
 
 
function addBannerSpace() {
 
  var expandableBannerHeight = $('div#{{{banner}}}').height() + 44 + $('div#{{{banner}}}-legal').height();
 
  switch(skin) {
 
    case 'vector':
 
      $('#{{{banner}}}').css( 'top', 0 - expandableBannerHeight );
 
      $('#mw-panel').animate({top: expandableBannerHeight + 160}, 1000);
 
      $('#mw-head').animate({top: expandableBannerHeight}, 1000);
 
      $('#mw-page-base').animate({paddingTop: expandableBannerHeight}, 1000);
 
      break;
 
    case 'monobook':
 
      $('#globalWrapper').css('position', 'relative');
 
      $('#globalWrapper').css('top', expandableBannerHeight);
 
      $('#{{{banner}}}').css('top', '-20px');
 
      $('#{{{banner}}}').css('background', 'none');
 
      break;
 
  }
 
  $('#{{{banner}}}').css('display', 'block');
 
  $('#{{{banner}}}').animate({top: 0}, 1000);
 
}
 
function removeBannerSpace() {
 
  switch(skin) {
 
    case 'vector':
 
      $('#mw-panel').css('top', 160);
 
      $('#mw-head').css('top', 0);
 
      $('#mw-page-base').css('padding-top', 0);
 
      break;
 
    case 'monobook':
 
      $('#globalWrapper').css('position', 'relative');
 
      $('#globalWrapper').css('top', 0);
 
      break;
 
  }
 
}
 
 
function increaseImpCount() {
 
  impCount = parseInt($.cookie('centralnotice_banner_impression_count')) | 0;
 
  $.cookie('centralnotice_banner_impression_count', impCount + 1, { expires: 7, path: '/' });
 
  return impCount + 1;
 
}
 
 
function increaseBannerImpCount() {
 
  var impCount = 0;
 
 
  if($.cookie('centralnotice_single_banner_impression_count')) {
 
    var impCountCookie = $.cookie('centralnotice_single_banner_impression_count');
 
    var bannerImpCount = impCountCookie.split("|");
 
    if(bannerImpCount[0] === '{{{banner}}}') {
 
      impCount = parseInt(bannerImpCount[1]);
 
    }
 
  }
 
  $.cookie('centralnotice_single_banner_impression_count', '{{{banner}}}|' + (impCount + 1), { expires: 7, path: '/' });
 
  return (impCount + 1);
 
}
 
 
function validateForm() {
 
  var chkdPayment = $( 'input[name=pay]:checked', '#{{{banner}}}-form' ).val();
 
  switch( chkdPayment ) {
 
    case "BEZ":
 
      $( '#form-page' ).val( 'Formularseite2-Lastschrift' );
 
      break;
 
    case "UEB":
 
      $( '#form-page' ).val( 'Formularseite2-Überweisung' );
 
      break;
 
    case "PPL":
 
      $( '#form-page' ).val( 'Formularseite2-PayPal' );
 
      break;
 
    case "MCP":
 
      $( '#form-page' ).val( 'Formularseite2-Micropayment' );
 
      break;
 
  }
 
  var form = document.donationForm;
 
  var error = false;
 
 
 
  if($('#interval_multiple').attr('checked') === 'checked') {
 
    if($('input[name=interval]:checked', form).length !== 1) {
 
      alert("Es wurde kein Zahlungsintervall ausgewählt.");
 
      return false;
 
    } else {
 
      $('#periode').val($('input[name=interval]:checked', form).val());
 
    }
 
  } else {
 
    $('#periode').val("0");
 
  }
 
 
  // Get amount selection
 
  var amount = null;
 
  for ( var i = 0; i < form.betrag.length; i++ ) {
 
    if ( form.betrag[i].checked ) {
 
      amount = form.betrag[i].value;
 
      break;
 
    }
 
  }
 
  if ( form.amountGiven.value != "" ) {
 
    var otherAmount = form.amountGiven.value;
 
    otherAmount = otherAmount.replace(/[,.](\d)$/, '\:$10');
 
    otherAmount = otherAmount.replace(/[,.](\d)(\d)$/, '\:$1$2');
 
    otherAmount = otherAmount.replace(/[\$,.]/g, '');
 
    otherAmount = otherAmount.replace(/:/, '.');
 
    form.amountGiven.value = otherAmount;
 
    amount = otherAmount;
 
    $('#input_amount_other').val( otherAmount );
 
  }
 
  // Check amount is a real number
 
  error = ( amount == null || isNaN( amount ) || amount.value <= 0 );
 
  // Check amount is at least the minimum
 
  if ( amount < 1 || error ) {
 
    alert( 'Der Mindestbetrag beträgt 1 Euro.');
 
    return false;
 
  } else if ( amount > 99999 ) {
 
    alert( 'Der Spendenbetrag ist zu hoch.' );
 
    return false;
 
  }
 
  return !error;
 
}
 
</script>
 
  </body>
 
</html>
 

Aktuelle Version vom 11. September 2018, 16:42 Uhr

 <a href="https://itunes.apple.com/de/app/hurraki-leichte-sprache-app/id903688766?mt=8"></a>

<a href="#" title="Schließen" onclick="mw.centralNotice.hideBanner();return false;">Schließen</a>