php - Wordpress interfering with javascript modal popup - Stack Overflow

admin2025-04-29  1

My site is built on Wordpress, but I also have many PHP based pages. My Wiki is built from my database. I am trying to show another page of my own site (entitycard.php) in a javascript popup iframe, when hovering over a link to show stats of in-game weapons/armors/items. It works great, but for some reason entitycard.php is giving me the Wordpress "Sorry, no posts matched your criteria" issue.

See video below showing the problem on my site, but it working great on localhost. Here is also a screenshot of the issue on my site versus it working in localhost. I appreciate any insight.

Working in localhost versus issue in PROD:

Website where you can see the issue: .php?name=Tomek .php?entityid=697711

entitycard.php is just a connection to database and then output. Nothing Wordpress within it.




Code below for anyone who may want to beg, borrow, steal :)

CSS style:

    <style>
        /* The Modal (background) */
        .modal {
            display: none; /* Hidden by default */
            position: fixed; /* Stay in place */
            z-index: 1; /* Sit on top */
            left: 0;
            top: 0;
            overflow: auto; /* Enable scroll if needed */
            background-color: rgb(0,0,0); /* Fallback color */
            background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
        }

        /* Modal Content/Box */
        .modal-content {
        }
    </style>

onmouseover hover js/php and popup iframe:

...
echo "<td><a onmouseover=\"showPopup(this)\" onmouseout=\"hidePopup(this)\" href=\"entity.php?entityid=$entity_id\">$name_with_quantityplusraritystarlevel</a></td>";
...
echo "<div id=\"myModal\" class=\"modal\">";
    echo "<div class=\"modal-content\">";
        echo "<iframe onload=\"resizeIFrameToFitContent()\" id=\"popupcontent\" height=\"200px\" width=\"150px\"></iframe>";
    echo "</div>";
echo "</div>";

Javascript for popup hide/show:

<script>
    // START: Code for popup on entity link hover
    var modal = document.getElementById('myModal');
    // To show the modal popup when hovering over the Entity URL link
    showPopup = function(context) {
        let link = context.href;
        link = link.replace("entity.php", "entitycard.php");
        //link example is .php?entityid=697711
        modal.style.display = "block";
        document.getElementById("popupcontent").src = link;
        resizeIFrameToFitContent();
    };

    // When the user moves mouse off of link, close the modal
    hidePopup = function(context) {
        modal.style.display = "none";
    }
    
    // To resize the popup iFrame
    function resizeIFrameToFitContent() {
        document.getElementById("popupcontent").width  = 0;
        document.getElementById("popupcontent").height  = 0;
        document.getElementById("popupcontent").width  = document.getElementById("popupcontent").contentWindow.document.documentElement.scrollWidth + 7;
        document.getElementById("popupcontent").height = document.getElementById("popupcontent").contentWindow.document.documentElement.scrollHeight;
    }
    // END: Code for popup on entity link hover
</script>
转载请注明原文地址:http://www.anycun.com/QandA/1745932854a91309.html