le formule magiche

Apple devices solutions

Soluzioni specifiche per dispositivi Apple

Information on accessing these resources Informazioni sull'accesso a queste risorse

Member contact form Modulo di contatto per i membri
Per aiuto e segnalazioni

Membership index

NOTE: NOTA: Downloads reserved for members can also be made without registration with a free donation in support of the site. I download riservati ai membri possono essere effettuati anche senza registrazione con una donazione libera in sostegno del sito.

List of downloadable sresources with donationLista delle risorse scaricabili con donazione

Review of solutions for different display problems on Apple devices.

Rassegna di soluzioni per differenti problematiche di visualizzazione su dispositivi Apple.

Background-image on Apple devices

Immagine di sfondo su dispositivi Apple

Unfortunately, Apple Safari has a problem in rendering still background images.
To solve the problem, in case you want to upload an image as a fixed background of the website, you need to use these style rules:
Sfortunatamente, Apple Safari ha un problema nel rendering di immagini di sfondo fisse.
Per risolvere il problema, in caso si voglia caricare un'immagine come sfondo fisso del sito web, bisogna usare queste regole di stile:

body:after{
      content:"";
      position:fixed; /* stretch a fixed position to the whole screen */
      top:0;
      height:100vh; /* fix for mobile browser address bar appearing disappearing */
      left:0;
      right:0;
      z-index:-1; /* needed to keep in the background */
      background: url(../img/bg.jpg) center top;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}

Fix text size on iOS devices

Fissare dimensione testo su dispositivi iOS

Mobile Safari on iPhone automatically increases text size. To get around this, let's add these style rules to the body. Mobile Safari su iPhone aumenta automaticamente le dimensioni del testo. Per ovviare al problema, aggiungiamo queste regole di stile al body.
body {
-webkit-text-size-adjust:100%;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
}

Activate scroll on iOS devices

Attivare lo scroll su dispositivi iOS

Scrolling doesn't work on iPhone unless you add these rules: Lo scroll non funziona su iPhone se non si aggiungono queste regole:
overflow: auto;
  -webkit-overflow-scrolling: touch;
  overflow-y: scroll;

Change specific css rules for display on iOS devices

Cambiare specifiche regole di stile per la visualizzazione su dispositivi iOS

Example: Esempio:
<script>
// show alternative content to iOS users (no background-attachment fixed )
var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
if (iOS){
    $(function() {
    $(".parallax ").css("background-attachment","scroll");
    //add more rules here
    });
}
</script>

Change specific css rules for display on Safari browser

Cambiare specifiche regole di stile per la visualizzazione su browser Safari

Example: Esempio:
<script>
// show alternative content to Safari users (no background-attachment fixed )
   var userAgent = navigator.userAgent.toLowerCase();
     if (userAgent .indexOf('safari')!=-1){          
          $(".parallax ").css("background-attachment","scroll");
       }
   </script>

Force style settings for form input fields on mobile Safari

Forzare impostazioni di stile per le sezioni input dei form su Safari mobile


Safari on iPhone and iPad applies default settings for input fields that override classic style rules.
You can force these settings using these rules.
Safari su iPhone e iPad applica impostazioni predefinite per i campi input che sovrascrivono le regole di stile classiche.
Si possono forzare tali impostazioni utilizzando queste regole.

input[type="date"], input[type="time"] {
    -webkit-appearance: none;
     border-radius: 0;
}

You need to add the types of the various inputs you want to modify.
The border-radius: 0 rule (optional) eliminates rounded corners that are automatically applied by Safari mobile.
Bisogna aggiungere i type dei vari input che si vogliono modificare.
La regola border-radius:0 (opzionale) elimina gli angoli arrotondati che vengono applicati da Safari mobile in automatico.

Membership index