Jump to content


  • Posts

  • Joined

  • Last visited

Everything posted by THRobinson

  1. Weird... had this set to notify of responses, never got anything... just checked now and had 3. Database would be I think what I'm after, so I can just add info and a pic and the site automatically brings it in. Username wise... ya, mine looks bad, but my name is Thomas H. Robinson.... T.H.Robinson... but yes, sounded out, it is a bit porn-ish.
  2. I took a few small courses in HTML/CSS, but honestly, been years since I used either so, I have a basic understanding but very much a beginner for web sites. Looking to re-do the site for where I work, appliance shop, and wondering about how to handle online inventory. Won't be anything major like 100+ items... but would like to be able to have (example) a page for Fridges, Image with basic specs, and when clicked either expands for more details, or, might just link to the manufacturer's spec page at that point. When I first started HTML, we would have done tables and whenever a new product is added or item removed, you'd have to go into the HTML and edit the thing. Long/slow pain in the butt. For something like this, with maybe 50 items total.... is there a good/easy way to do this? maybe a few basic sort functions like price hi/low? I'm not sure what I would Google to get the correct info, so hoping someone can steer me in the right direction then I can search for tutorials and such to get it done. Just, at this point, I don't know what I'm looking for, just what I know I want in the end. Thanks
  3. I will never understand how you guys know all this. I Google and pray. I figured the code was excessive when I saw it in Dreamweaver... all I needed was a simple rollover clickable link. What I have works but, seems problematic.
  4. Seems to work fine. Oddly, I decided to try using an external javascript.js file for the site, and bam... thing just died. That console brings up many issues, most I simply don't get and pretty much all are related to the Dreamweaver generated script for the rollover images. Switched it back, save myself some headache. Small site so, not much code to leave in the html. I coulda sworn, the rollovers were much simpler and involved less code when I used it years ago. Guess next issue I need to figure out, the prof wants everything done in DTD XHTML 1.0 Strict, which seems to show more errors than if I changed it to DTD XHTML 1.0 Transitional...
  5. I removed the onload="MM_preloadImages('images/logob.jpg','images/workb.jpg','images/infob.jpg','images/contactb.jpg')" from the body and totally worked... I only had that there because Dreamweaver added it when I created the rollover images. Would never have guess that that would have affected the image replace. Thanks for the suggestion... I would have sat there playing with the IDs and file locations etc, for hours with (obviously) no results.
  6. Refresh didn't do anything... like I said, I know zilch about java, just doing a small intro class for html/css so, zero clue about inits and functions etc. Just hoped it was something simple that someone looking at my code would see and know where it went wrong, like data-picname is wrong, or missed punctuation somewhere, etc.
  7. Console tab, when clicked, shows a window with a single blue > and nothing else. Clicked around and such but nothing changes and no messages appear in the console. Maybe the code is fine? I'm just missing something to go with it?
  8. Sadly I know zilch about java... just nearing the end of a small HTML/CSS correspondence class that kinda mentions java and had a few simple samples to cut/paste into the code. Deirdre's Dad was kind enough to send me some basic code to use for my situation but, doesn't want to work for me in EI/Chrome where I'm testing my site from. I used CTRL+SHFT+I in Chrome, but, not showing me errors that I can see, just, the code. Same as I see in Dreamweaver CS5. Not sure if the onclick isn't working, or I linked the images wrong. When it comes to java, all I know is quite literally, onclick means something is gonna happen when clicked, getElementByID means it's looking for the ID of something... and that's about all I know.
  9. Finally re-working my website, looks the same but WAY WAY fewer DIVs than before. Started work on the page that includes this script and not co-operating. I click and no images seem to change. Did I change something I shouldn't have? My artwork is in an images folder so, added the images/, and the artwork shows up on my page, just no reaction to clicking. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" /><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>THRobinson - Design/Photography</title><style type="text/css" media="screen">@import url("main.css");</style><!--Script created by DreamWeaver CS5 for Rollover Image. Validation shows errors, assuming because jscript.--><script type="text/javascript">function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;}function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}}function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x;}function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}}</script><!--Script for thumbnail/image swap.--><script type="text/javascript"> function changePic () { document.getElementById("mainpic").src = this.getAttribute("data-picname"); } function init () { document.getElementById("thumb1").onclick = changePic; document.getElementById("thumb2").onclick = changePic; document.getElementById("thumb3").onclick = changePic; } window.onload = init;</script></head><body onload="MM_preloadImages('images/logob.jpg','images/workb.jpg','images/infob.jpg','images/contactb.jpg')"> <div class="container"> <div class="header"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('logo','','images/logob.jpg',1)"><img src="images/logo.jpg" alt="logo" width="150" height="170" border="0" id="logo" name="logo" /></a><img src="images/bar_01.jpg" width="600" height="170" alt="titlebar" /><a href="artwork.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('artlink','','images/workb.jpg',1)"><img src="images/work.jpg" alt="artwork link" width="50" height="170" border="0" id="artlink" name="artlink" /></a><a href="info.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('info','','images/infob.jpg',1)"><img src="images/info.jpg" alt="information" width="50" height="170" border="0" id="info" name="info" /></a><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('contact','','images/contactb.jpg',1)"><img src="images/contact.jpg" alt="contact" width="50" height="170" border="0" id="contact" name="contact" /></a></div> <div class="menu"></div> <div class="artwork"> <img class="artlarge" src="images/image_1a.jpg" id="mainpic" width="550" height="350" alt="mainpic" /> <img class="artthumb1" src="images/image_1b.jpg" id="thumb1" width="150" height="100" alt="thumb1" data-picname="images/image_1a.jpg" /> <img class="artthumb2" src="images/image_2b.jpg" id="thumb2" width="150" height="100" alt="thumb2" data-picname="images/image_2a.jpg" /> <img class="artthumb3" src="images/image_3b.jpg" id="thumb3" width="150" height="100" alt="thumb3" data-picname="images/image_3a.jpg" /></div> <div class="blurb"></div> </div></body></html>
  10. That worked! So... the "stuff" going into the area I want needs to be absolute, and the space it's going into needs to be relative? This is the stuff that eats up most of my time trying to figure out, but I guess that's learning. Thanks a bunch, I'd have spent easily another hour on it and likely never solved it. Out of curiosity, what caused it to jump across the screen when clicked? I can understand it not appearing correctly or simply not working, but the giant jump across the screen baffles me.
  11. Well, class is online, and has sample pages... but the sample pages we get are very basic. No headers, footers, no div container with stuff inside etc... just plain text starting at the top-left corner on a white page page with a sample script. Once you grab the scrip and start putting it into a designed page... that's when stuff seems to be breaking for me. I have 2 css files, a main css, and a css just for the chips. I have a div setup for the centre of my screen, with the fridge set as a background image. Hopefully the CCS's aren't too big to post.... thread is already long from the last code. As mentioned, everything passes verification... though I'm pretty certain there are better ways to do what I'm doing. All part of learning I guess. Fridgepoetry.css @charset "utf-8";/* CSS Document */.chip {position:relative;padding: .5em;border: 1px solid #333;border-right: 3px solid #333;border-bottom: 3px solid #333;background-color: #FFC;cursor: move;z-index: 0;height: 1em;width: 5em;text-align:center;}#chip1 {top: 5px;left: 5px}#chip2 {top: 5px;left: 25px}#chip3 {top: 10px;left: 5px}#chip4 {top: 10px;left: 55px}#chip5 {top: 15px;left: 10px}#chip6 {top: 15px;left: 25px} Main.css @charset "utf-8";/* CSS Document */a:link {color: #333;text-decoration: none;}a:visited {color: #333;text-decoration: none;}a:hover {color: #F60;text-decoration: none;}a:active {color: #F60;text-decoration: none;}@font-face { font-family: 'BebasNeueRegular'; src: url('fonts/BebasNeue-webfont.eot'); src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/BebasNeue-webfont.woff') format('woff'), url('fonts/BebasNeue-webfont.ttf') format('truetype'), url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal;}body {background-image: url(images/background.jpg);background-repeat: repeat;background-position: center;margin: 0;padding: 0;font-family: Arial, Helvetica, sans-serif;font-size: 0.9em;color: #333;}h1 {font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;font-size: 6em;padding-bottom: 0em;padding-top: 0em;}h2 {font-family: Arial, Helvetica, sans-serif;font-size: 2em;text-align: center;}h3 {font-family: Arial, Helvetica, sans-serif;font-size: 2em;padding-top: .25em;}#title {font-weight: normal;font-style: normal;text-align: center;color: #333;}#key { visibility: visible; position: relative; top: 1em;}/* ~~ this fixed width container surrounds the other divs ~~ */.container {width: 750px;margin-left: auto;margin-right: auto;margin-top: 10px;}.header {width: 750px;height: 100px;background-color: #CCC;opacity: 0.6;}.body {width: 750px;height: 300px;background-color: #CCC;opacity: 0.4;}.fridge {width: 750px;height: 600px;background: url(images/fridge.jpg) no-repeat;}.doorback {width: 750px;height: 600px;background: url(images/door.jpg) no-repeat;padding-left: 2em;padding-bottom: 0;}.footer {width: 750px;height: 75px;background-color: #CCC;opacity: 0.6;}.links {width: 50%;height: 100px;float: left;}
  12. Hmm... the samples we have have the script tags, but, up in the header. This what I have... trying to make a page look like an old fridge, doing that 'Fridge Poetry' that was popular like 10+ yrs ago... just to show an example of the drag/drop with small boxes of words. Samples given aren't in a container div like mine so... maybe I have them in the wrong spot as a result? W3C Markup Validation passes on this and the css files. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Project 7</title><script type="text/javascript">var object = null;var cX = 0;var cY = 0;function initPage () {document.onmousedown = pickIt;document.onmousemove = dragIt;document.onmouseup = dropIt;}function pickIt(evt) {var objectID = (evt.target) ? evt.target.id : ((evt.srcElement) ? evt.srcElement.id : null);var evt = (evt) ? evt : ((window.event) ? event : null);if (objectID.indexOf('chip')!=-1) object = document.getElementById(objectID);if (object) { object.style.zIndex = 100; cX = evt.clientX - object.offsetLeft; cY = evt.clientY - object.offsetTop; return;}else { object = null; return;}}function dragIt(evt) {evt = (evt) ? evt : ((window.event) ? event : null);if (object) { object.style.left = evt.clientX - cX + 'px'; object.style.top = evt.clientY - cY + 'px'; return false;}}function dropIt() {if (object) { object.style.zIndex = 0; object = null; return false;}}</script><style type="text/css"> @import url("main.css");</style><style type="text/css"> @import url("fridgepoetry.css");</style></head><body onload="initPage()"><div class="container"><div class="header"><h1 id="title">Project | 7</h1></div><div class="fridge"><div id="chip1" class="chip">One</div><div id="chip2" class="chip">Ring</div><div id="chip3" class="chip">to</div><div id="chip4" class="chip">Rule</div><div id="chip5" class="chip">Them</div><div id="chip6" class="chip">All</div></div><div class="footer"><div class="links"><h2><a href="index.html">Home</a></h2></div><div class="links"><h2><a href="java2.html">Java | 2</a></h2></div></div></div></body></html>
  13. Hey there, I'm a newbie, still learning HTML5/CSS3 and working on a small project with some java script for an online course. Not having much luck when it comes to dropping it into a div container... original scripts are in a main container, however, pages I'm doing have a main container centred on screen, with containers inside (header, footer, main, etc) since I've learned that tables are now no longer used for the most part. I found that if I changed the css position from 'absolute' like in the examples we get to 'relative' the stuff at least shows up inside the div I want it to instead of the top left corner of the entire page. That being said, the sample I'm working on now, when I click the squares to move them, they jump down/over about 150px, which it doesn't do when set to 'absolute'. I apologize since I know it makes sense in my head but I'm certain makes no sense when reading it. Basically, drag/drop elements when the css is set to 'absolute' work fine, but appear top left of the screen. When set to 'relative' they appear inside the div where I want them to be, but, when clicked they jump over and down but still drag/drop... just considerably far from the pointer. Is there a trick I'm missing? As mentioned, I have a main container div, set at 750px wide, margin-left/right set to auto so appears centre. I then have divs set up like header, footer, body, that I put inside the container div. I'm trying to put a script inside the body. Should I zip/attach or just copy/paste the code? I have an html, two css sheets, and jpgs (background art). Or does someone have a suggestion to try without uploading anything? Thanks
  14. Awesome.... will give it a try ASAP. Will be a great help if it works, I kinda dreaded having a site loading 30 different pages to look at 10 examples. Thanks.
  15. I'm not very good with programming, still learning HTML5/CSS3, so I apologize if this is a dumb request. I'm doing a web page (online portfolio) and I have the layout done and looking near how I want, however, on pages where I am showing samples of my work, I have imageA1 large and in the centre, and to the right, 3 thumbs (imageA1, imageA2, imageA3) so when you click a thumb the central image loads to that jpg. I want to avoid using flash. As it is now, if I click imageA1, it loads the page ../imageA1.html, if I click the thumbnail for image1B, it loads .../image1B.html etc... I'm hoping someone can point me to where I can find a good copy/paste script so that I load .../imageA.html and when I click the thumbs its a simple image replace for the central image instead of loading another html. That way, if I have 10 pieces in my portfolio with 3 images each, I only have 10 html/pages to load instead of 30. Hopefully that made sense. I've found image replace but, always 1 image and a click or mouseover swaps it to another image. I want 1 image in the centre, and 3 thumbs that when clicked or mouseovered swap the central larger image. Thanks.
  16. I'm a complete newbie... I knew HTML1 years back, just trying to learn HTML5/CSS and well, making progress but slowly. Trying to do a small portfolio site for myself (art/photos/design) and have a pretty good chunk of the site done now, except having a 'few' issues with a vertical menu. Tried searching for it online for an hour, and everything is way too fancy for what I am after, or the subs are flyouts. I finally found something close, but jquery. Just wondered if anyone could point me to a cut/paste, download, or tutorial on how to do a menu like the one in the below link, however, right justified. I know, most are probably going to ask 'why right justified'... simply put, it matches the design/layout of my site. Wasn't sure to post this here or jquery, the below is jquery but really just want a working menu at this time that expands and stays open. What I have now is all double spaced, just have a list... which is fine for main menu items but I want the sub menus to be single spaced and no bullets/numbers. Basically, when on the Portfolio section of the site, I want the menu to appear, stay on the left throughout the pages, and when I click DESIGN, it expands, lists projects, I can click the project which takes me to that page but the menu stays open until I leave that section type deal. Can anyone point me into the right direction? Way behind on this project and running out of hair to pull. Link:http://www.stunichol...nutree.html#url ThanksHere is a layout of the site saved as a JPG for reference, menu on the left
  17. It's all good... did the div tag and added space at the bottom and just kept the scrollbar there.Tried searching online for the initial problem which I couldn't find a solution... likely because nothing was wrong, just didn't think to check the scroll bar as the cause.
  18. Ah, sadly I don't know CSS... would like to and plan to learn, but for now, I need a site up ASAP so I can send out resumes and such as a designer (print design mainly, not web) and photography.But I'll copy that tidbit of info down and once I have a site up, I'll try working on CSS for a revised version of the site.Thanks guys.
  19. I have no idea how to do it otherwise... and sadly not enough time to learn. :)What should be used? To keep things in a grid tables seemed the right way...Also, if anyone knows... is there a way to centre the site ignoring the scrollbar?Thanks
  20. ... ug... I think I may have it figured out....scroll bar on the right side disappears. Friend didn't see it because at 1024x768 there is always a scroll bar...
  21. Not sure how to describe this but...I made a page for a site, got it setup how I like etc. then just saved multiple copies of it under different names for each page of the site. When I toggle from one page to the next everything is cool, however, the main page, when I delete no longer needed tables, the site shifts to one side by a good 15px.I have a table setup at 950px wide set to centre of the screen. Inside that table I have tables and tables-in-tables etc... and its when I delete the inner-inner tables it shifts. The overall size remains at 950px and centre.Any ideas why it would do that?I have a 22" Samsung set at 1680x1050, and I have viewed the site on my Mac (Safari) and my PC (IE8/FireFox3) and same thing, though a buddy of mine has a 19" monitor and says he barely sees the shift.I'm also using Dreamweaver CS3 on a PC, if makes a difference.Can anyone spot what I'm missing? Not really a web designer, just learning as I go so, probably obvious what I missed to most people.ThanksShifthttp://www.thomashrobinson.com/shift001.htmlNo Shift (the way it should be compared to the other pages)http://www.thomashrobinson.com/shift002.htmlScreen Shot Samplehttp://www.thomashrobinson.com/test.jpg
  22. Hey thanks!I scoured through the code looking for a bold tag, highlighted the type and toggled bold on/off etc... was going nuts!Well, hopefully my next issue is a simple fix... will post in a new thread but, involved an odd shift of the screen whenever a delete a specific table within a table. Yet the main table size never changes and always set to centre. Driving me nuts.
  23. I'm one of those people who know enough about HTML to make a site but not enough that I'll be making a living at it anytime soon.I'm trying to do a website for myself without enough ability to make a CSS template so just using HTML and Dreamweaver CS3.Basically, having the problem with how ARIAL appears inside vs outside a table.examplehttp://www.thomashrobinson.com/test.htmlAs you can see... VERY basic code used, set to ARIAL as a default font, yet the middle line which falls inside a table appears bolder than the rest.Is there a trick to fix this?Thanks.
  • Create New...