Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • March 26, 2024 at 3:33 pm #1438354
    greg47

    Hello,
    I try to display a specific page only on mobile and diplay a message : “thank you to connect you on mobile to display this page”

    I past this code in my page, it’s hidden if i’m on desktop for example, but my message does not appears.

    Do you know why ? 

    
<!DOCTYPE html>
<html lang="fr">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vérification d'accès via mobile</title>
<style>
    #message {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
        font-size: 24px;
        z-index: 99999; /* Met le message au premier plan */
    }
</style>
<script>
window.onload = function() {
    // Vérifie si l'utilisateur accède à la page depuis un téléphone mobile
    var isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
    
    if (!isMobile) {
        // Affiche le message si l'utilisateur n'accède pas depuis un téléphone mobile
        document.getElementById("message").innerHTML = "Ce site est adapté pour les téléphones mobiles, merci d'y accéder via votre smartphone.";
        document.getElementById("message").style.display = "block"; // Affiche le message si nécessaire
    } else {
        // Affiche le contenu de la page s'il est consulté depuis un téléphone mobile
        document.body.style.display = "block";
    }
};
</script>
<body style="display: none;">
<div id="message"></div>

</body>
</html>

    Thank you for your help

    • This topic was modified 8 months ago by greg47.
    March 26, 2024 at 9:29 pm #1438377
    Rikard

    Hey greg47,

    You might be better off using the visibility functionality which can be found under Advanced->Responsive for most elements in the Layout Builder. You can select which content should be visible on which screen sizes.

    If you need help with custom code, then a forum like Stackoverflow might be better to post your questions in.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.