gpt4 book ai didi

javascript - 另一个 html 页面滚动条问题中的 HTML/CSS/JavaScript Html 页面

转载 作者:行者123 更新时间:2023-11-28 05:29:21 25 4
gpt4 key购买 nike

当我尝试将另一个 HTML 文件加载到我现有的文件中时遇到问题。我在我的 html 代码中使用具有此功能的 JavaScript 来做到这一点

<script>
function load_home(){
document.getElementById("content").innerHTML='<object type="type/html" data="New folder\home.html" ></object>';
}
</script>

Q1: This code does not find the "home.html" when it is in the folder if I move it to the same folder and change it to data="home.html" it works as it should . Can it be solved ?

Q2: Even when the code finds my "home.html" it loads in a box-type thing with scroll bars , to be able to see the full content of the page ( the scroll bars can be vertical or horizontal depending on the content inside the loaded page )

enter image description here

“index.html”和它的“style.css”文件:

/* Font to left and change text type*/
body{
margin : 0;
padding : 0;
font-family : 'Arial',serif;
min-width:1200px;
}

a{
text-decoration : none;
}
/*NAV CLASS */
#menu >.nav {

background-color : #87CEEB;
color: white;
list-style : none;

padding : 4px 0 12px 0;
margin : 0px;
}
/*CONTENTS RIGHT*/

.nav > .nav-contects{
text-align : right;
}
#menu >.nav > .nav-contects > li {
display : inline-block;
padding-right: 50px;/*same as 0 25px 0 25px ( top left bottom right */

font-size: 16px;
margin : 0;
position : relative;
bottom : 10px; /*align width center */

}
/*a tag inside a li tag inside a .nav class*/
#menu >.nav > .nav-contects > li > a {
color: #f79963;
}
/* a tag inside a li tag inside a .nav class while mouse hovering */
#menu > .nav > .nav-contects > li > a:hover {
color : #ffffff;
padding : 0 0 0 0 ;
/*margin : 0px;
background-color : #888888;*/
}
<DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<title>
my title
</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body onload="load_home()">

<nav id="menu">
<ul class="nav">

<div class="nav-contects">

<li><a href="#Home" onclick="load_home">Home</a></li>
</div>
</ul>
</nav>

<div id="content" align = "center">

</div>
<script>
function load_home(){
document.getElementById("content").innerHTML='<object type="type/html" data="New folder\home.html" ></object>';
}
</script>
<div class="footer" align = "center">
<p align = "center"> <i>an awesome business</i> </p>
</div>
</body>

</html>

“home.html”文件

<DOCTYPE html>
<html lang="en">

<body>
Some random long text
dasfda gsdwgdsgd
sgsdgsdgdsf sadddad asddddddddddddddddddddddddddddddddddddddddddddddd
</body>

</html>

PS:这可能都是错的,也许我正在尝试用错误的方式做所有事情

PSS:这不是我文档的完整代码,我删除了很多代码以确保它没有错误,包括样式和其他

编辑#1:我希望“受限”框消失并打开“home.html”,就像我直接从计算机上打开它一样”


我非常感谢您提供的任何帮助。

最佳答案

(1) 此问题可能是由您的网址中的空格引起的。它应该使用 encodeURI(src)src.replace(//g, '%20') 进行转义 CSS and JQuery: spaces inside image name break code of url()

(2) 如果您只想让滚动条消失,请将样式 overflow: hidden 添加到您的弹出窗口。但是请注意,如果任何内容从包装盒中溢出,将无法看到/无法挽救。

关于javascript - 另一个 html 页面滚动条问题中的 HTML/CSS/JavaScript Html 页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38596097/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com