Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #687589

    hi,

    i have a custom code to show an info-box by mouseover. For that i use the following code:

    <script type="text/javascript" language="JavaScript">
    
    var offsetx=20
    var offsety=0
    
    function InfoBoxAusblenden() {
          document.getElementById('InfoBox').style.visibility = "hidden";
    }
    
    function InfoBoxAnzeigen(e,Inhalte,offsetX,offsetY)
    {
            if (offsetX) {offsetx=offsetX;} else {offsetx=20;}
            if (offsetY) {offsety=offsetY;} else {offsety=0;}
            var PositionX = 0;
            var PositionY = 0;
            if (!e) var e = window.event;
            if (e.pageX || e.pageY)
            {
                    PositionX = e.pageX;
                    PositionY = e.pageY;
            }
            else if (e.clientX || e.clientY)
            {
                    PositionX = e.clientX + document.body.scrollLeft;
                    PositionY = e.clientY + document.body.scrollTop;
            }
            
            document.getElementById("BoxInhalte").innerHTML = Inhalte;
            document.getElementById('InfoBox').style.left = (PositionX+offsetx)+"px";
            document.getElementById('InfoBox').style.top = (PositionY+offsety)+"px";
            document.getElementById('InfoBox').style.visibility = "visible";
    }
    
    </script>
    
    <style type="text/css">
    
    #InfoBox {
    visibility:hidden;
    position:absolute;
    top:10px;
    left:10px;
    z-index:1;
    
    /* diese Angaben können Sie anpassen */
    width:300px;
    background-color:#FDFEFF;
    border:4px solid #0090E0;
    }
    
    /* weitere Box in der Info-Box für padding */
    #BoxInnen {
    padding:15px;
    }
    
    /* Formatierung Texte in der Info-Box */
    
    #BoxInhalte {
    font-family:Verdana,Arial,Helvetica,sans-serif;
    font-size:11px;
    color:#5F5F5F;
    line-height:130%;
    }
    
    </style>
    
    <!-- Anfang DIV für die InfoBox -->
    
    <div id="InfoBox" style="z-index:1; visibility:hidden;">
    <div id="BoxInnen"><span id="BoxInhalte">&nbsp;</span></div>
    </div>
    
    <!-- Ende DIV für die InfoBox -->
    
    <br><br>
    
    <a onmouseover="InfoBoxAnzeigen(event,'Hier steht Text<br>noch eine Textzeile Text<br>und eine dritte Zeile',20,-30);" onmouseout="InfoBoxAusblenden();" href="javascript:void(0)">MouseOver für mehr Info</a>
    <br><br>
    <a onmouseover="InfoBoxAnzeigen(event,'Text für die Infobox',20,-30);" onmouseout="InfoBoxAusblenden();" href="http://www.mydomain.net/">Link</a>

    the Javascript i load from an .js file from my child Theme.

    For the HTML i use the avia codeblock.

    The code works fine on other websites, but not on my enfold site. Can you plz have look?

    `

    • This topic was modified 8 years, 2 months ago by Chris_85.
    #688903

    Hey Chris_85,

    Thank you for using Enfold.

    We tried to login to the site but the credentials are incorrect. Please check it carefully and make sure that you have the latest version of the theme. What page did you add the script to?

    Best regards,
    Ismael

    #689671

    Hey Ismael,

    thanks for your answer. i found another way with css… thanks!

Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘custom code does not work fpr my enfold page…’ is closed to new replies.