Jump to content


 


Register a free account to unlock additional features at BleepingComputer.com
Welcome to BleepingComputer, a free community where people like yourself come together to discuss and learn how to use their computers. Using the site is easy and fun. As a guest, you can browse and view the various discussions in the forums, but can not create a new topic or reply to an existing one unless you are logged in. Other benefits of registering an account are subscribing to topics and forums, creating a blog, and having no ads shown anywhere on the site.


Click here to Register a free account now! or read our Welcome Guide to learn how to use this site.

Photo

HTML, JS, jQuery help


  • Please log in to reply
6 replies to this topic

#1 Ubernoober13

Ubernoober13

  • Members
  • 18 posts
  • OFFLINE
  •  
  • Local time:05:47 AM

Posted 18 July 2013 - 11:59 PM

Can someone please help me figure this out? I want to put this: http://www.marcofolio.net/webdesign/advanced_jquery_background_image_slideshow.html

Into this code. I have tried following their tutorial but it doesn't seem to work. I tried calling the jQuery and the JS but I am not sure if I did it right. I already know that I am in over my head, no need to tell me that. Any help would be great.

<!DOCTYPE html>
<html>

<head>

<title>FOPAC</title>

<link type="text/css" rel="stylesheet" href="CSS1.css"/>
<link type="text/css" rel="stylesheet" href="style.css"/>


<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.orbit.min.js" type="text/javascript"></script>
<script src="script.js" type="text/javascript"></script>



</head>
<body>

<h1>Future One Percent of America Club</h1>
			<h3>Home</h3>
			 <hr noshade size=4 width="100%"> 
			 
			<div id="navbar">
				<ul>
					<li><a href="home.html">Home</a></li>
					<li><a href="aboutFOPAC.html">About FOPAC</a></li>
					<li><a href="gettingstarted.html">Get Started</a></li>
					<li><a href="contacts.html">Contacts</a></li>
					<li><a href="videos.html">Videos</a></li>
					<li><a href="pictures.html">Pictures</a></li>
				</ul> 
			</div>
			
			<div id="bodytext">
			<p>Just some sample text!</p>
			</div>
		</body>
</html>


BC AdBot (Login to Remove)

 


#2 AdagioBoognish

AdagioBoognish

  • Members
  • 111 posts
  • OFFLINE
  •  
  • Gender:Male
  • Location:[ PDX ]
  • Local time:02:47 AM

Posted 19 July 2013 - 12:31 AM

Future one percent of america club? : ] I've covered some html in CIS120, but it was a quick introduction at best and didn't handle dynamic background images. Have you tried downloading his source code from the tutorial? It definitely helps me to have a working script to use while trying to follow a tutorial. The file I downloaded from his site is labeled MacOSx and while I can see that it contains his index and related pictures, I'm getting an error message when I try to view it in my browser. I dig html and want to look into stuff like this anyway, so I'll post back if I figure anything out. Chances are you'll get it before I do though. Good luck. 



#3 Ubernoober13

Ubernoober13
  • Topic Starter

  • Members
  • 18 posts
  • OFFLINE
  •  
  • Local time:05:47 AM

Posted 19 July 2013 - 12:37 AM

 Have you tried downloading his source code from the tutorial? It definitely helps me to have a working script to use while trying to follow a tutorial. The file I downloaded from his site is labeled MacOSx

I have downloaded the source code and tried to make it work. Look in the folders called CSS, images, and js. How should I be calling these files if they are inside the same folder?

 

Another off topic question. How do I get everything to align in the middle? When I use this the #navbar will not move to the middle. I want it to auto adjust according to how big your monitor is.



#4 AdagioBoognish

AdagioBoognish

  • Members
  • 111 posts
  • OFFLINE
  •  
  • Gender:Male
  • Location:[ PDX ]
  • Local time:02:47 AM

Posted 19 July 2013 - 01:31 AM

Figured out what I was doing wrong when unpacking the zipped source code so I'll play with that tomorrow. I have to work in the morning so it's my last post before bed. I added the following <div> tag below <body> in order to auto align the entire content of the html:

 

<!DOCTYPE html>
<html>

<head>

<title>FOPAC</title>

<link type="text/css" rel="stylesheet" href="CSS1.css"/>
<link type="text/css" rel="stylesheet" href="style.css"/>

<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.orbit.min.js" type="text/javascript"></script>
<script src="script.js" type="text/javascript"></script>

 

</head>
<body>
<div style="margin:auto; width:50%;" />
<h1>Future One Percent of America Club</h1>
   <h3>Home</h3>
    <hr noshade size=4 width="100%">
   
   <div id="navbar">
    <ul>
     <li><a href="home.html">Home</a></li>
     <li><a href="aboutFOPAC.html">About FOPAC</a></li>
     <li><a href="gettingstarted.html">Get Started</a></li>
     <li><a href="contacts.html">Contacts</a></li>
     <li><a href="videos.html">Videos</a></li>
     <li><a href="pictures.html">Pictures</a></li>
    </ul>
   </div>
  
   <div id="bodytext">
   <p>Just some sample text!</p>
   </div>
  </body>
</html>

_________________________________________________________________

 

This is just what I've found out so far. It looks choppy and isn't quite right, but something to play around with to get you started. I'll look into it more tomorrow and see if I can figure it out. 



#5 Ubernoober13

Ubernoober13
  • Topic Starter

  • Members
  • 18 posts
  • OFFLINE
  •  
  • Local time:05:47 AM

Posted 19 July 2013 - 01:42 AM

Thank you so much! I have spend the last 2 hours trying to figure out how to do that inside of my #bodytext. If it makes a difference here is my css1 code.



body{
background-color:#FFFFFF ;

}

#footer {
	position: relative;
	top: -10px;
	background-color: #999999;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	clear:both
}

#navbar{
	float:left;
	position: center;
	padding:10px;
	text-align:center;


}

#bodytext{
	position:center;
	padding:50px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
	background-color: #CCCCCC;
	width: 608px;

} 
#content{
float:left;
background-color:transparent;

}

p{
max-width:75%;
position: center;
text-align:center;
	
}

li {
	display: inline;

	font-family: Futura, Tahoma, sans-serif;
	
}

h1{
	font-family: Verdana;
	font-weight: bold;
	text-align: center;
	padding-top: 25px;
	padding-bottom: 25px;
	color: black;
	font-size: 50px;
	}
	
h2{
	font-family: Arial;
	text-align: right;
	color: black;
	font-size: 8px;
	}
	
h3{
	font-family: Verdana;
	text-align: center;
	color: black;
	font-size: 18px;
	
}

ul{
list-style-type:none;
margin:0;
padding:0;

}
a:link,a:visited
{
display:block;
font-weight:bold;
color:#FFFFFF;
background-color:#00AAAA;
width:120px;
text-align:center;
padding:4px;
text-decoration:none;
-moz-box-shadow:    1px 1px 2px 3px #ccc;
  -webkit-box-shadow: 1px 1px 2px 3px #ccc;
  box-shadow:         1px 1px 2px 3px #ccc;
}
a:hover,a:active
{
background-color: #006666;
}




#6 groovicus

groovicus

  • Security Colleague
  • 9,963 posts
  • OFFLINE
  •  
  • Gender:Male
  • Location:Centerville, SD
  • Local time:03:47 AM

Posted 19 July 2013 - 10:11 AM

I have nothing to say but:

Future one percent of america club?

 

lol..subtle.



#7 Ubernoober13

Ubernoober13
  • Topic Starter

  • Members
  • 18 posts
  • OFFLINE
  •  
  • Local time:05:47 AM

Posted 19 July 2013 - 10:17 AM

I have nothing to say but:

 

Future one percent of america club?

 

lol..subtle.

 

It was a joke club started during the occupy wallstreet but my friend has taken it from 5 members to 50+ and they made their schools softball team over $500 last year. I am expanding to my own school with his help. If it was my option I would change the name but oh well, still looks nice if I found a club at my school on college application.






0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users