0
$(document).ready(function() {
$("#myPortfolioPage").hide();
$("#contactMeBox").hide();
$("#gameBox").hide();
$("#gameScrollButton").hover(function() {
$("#gameScrollButton").addClass("pointer");
});
$("#gameScrollButton").click(function() {
if (!($("#gameBox").hasClass("open"))) {
$("#gameBox").fadeIn(1000);
$("#gameBox").addClass("open");
} else {
$("#gameBox").fadeOut(1000);
$("gameBox").removeClass("open");
}
});
$(".contact").click(function() {
if (!($("#contactMeBox").hasClass("open"))) {
$("#contactMeBox").fadeIn(300);
$("#contactMeBox").addClass("open");
$('html, body').animate({
scrollTop: 0
}, 0);
} else {
$("#contactMeBox").fadeOut(300);
$("#contactMeBox").removeClass("open");
}
});
$(".contact").hover(function() {
$(".contact").addClass("pointer");
});
//My portfolio
$("#myPort").hover(function() {
$("#myPort").addClass("pointer");
});
$("#myPort").click(function() {
/*$("#contactMeBox").fadeOut(100);
\t \t $("#contactMeBox").removeClass("open"); */
$("#myPortfolioPage").fadeIn(750);
$('html, body').animate({
scrollTop: 0
}, 0);
/* Will edit out this error $("html,").animate({
"left": "-1375px"
}, "slow"); */
$("#homePage").animate({"left":"-1375px"},"slow");
//Code above in question ^^^^^^^ Thanks
});
//BackHome
$(".goHome").hover(function() {
$(".goHome").addClass("pointer");
});
$(".goHome").click(function() {
$("body").animate({
"left": "0px"
}, 1000);
$("#myPortfolioPage").fadeOut(500);
});
});
<body>
<div id=headerBoxAfter style="border-style:solid;margin-top:-20px;height:80px;width:100%;margin-left:-3px;background-color:black;text-align:left;">
\t \t \t <!-- <img id=gameScrollButton src=down56.png alt=downButton style=float:left;margin-left:12px;margin-top:3px -->
\t \t \t <h1 id=myName style=font-family:st;font-size:40px;margin-top:30px;margin-left:20px;> <span style=background-color:white;border-style:solid;padding:10px;>My</span> <span style=background-color:red;border-style:solid;padding:10px;margin-left:-35px;>Name</span> <span id=myPort style=color:white;> My Portfolio </span> </h1>
\t \t \t
\t \t </div>
\t \t
\t \t <div id=homePage style=boder-style:solid;height:100%;padding-bottom:20px;> <!-- homePage begins -->
\t \t
\t \t <div id=bodyBox style=height:100%;width:100%;border-style:solid;margin-left:0px;
</div>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
\t <script type="text/javascript" src="RyanTTSchultz.js"></script>
</body>
我想我的整个网页,当用户点击一个导航按钮向左移动。
我已经给定格框一个id =“主页” 我在我的js引用它像这样:
$("#homePage").animate({"left":"-1375px"},"slow");
以上符合“HTML,身体”的工作,但我决定让我的标题保持通用,并让下面的内容动起来。
谢谢。
请显示您的页面外观的最小代码示例。 –
这里没有足够的信息来帮助你。 –
如果你想要一个真正的答案,我们需要真正的问题来看看这里。所以如果你可以创建一个类似的** [demo](http://www.jsfiddle.net)**或者提供足够的代码来帮助你更好。 – divy3993