bobi93 Posted March 5, 2009 Share Posted March 5, 2009 Hello guys.That's my first post here...i hope i don't irritate anyone so...I know the basics of HTML and I'm making a simple web site.My problem is > I want to have a picture on the top center of the site(something like logo) ... When i include a java script in the html file the picture moves down and it`s not on the top (i tried removing the java script and the picture goes to its place again) Can you help me sort out this little hardship :)The other question is > I want to make something but i don't know what to search for so i can learn how to do it...So i will explain it to you.I want when i move from the different pages of the site my menu and the logo to stays loaded(i mean only the text in the middle of the website to be reloaded). Most of the sites i visit are like this.For example the menu contains this buttons : News,Music,Gallery,Downloads etc... there are commercials in the 2sides of the site and in the middle there is some text.When i move from News to Music i want the explorer to reload only the text...(that will save time when loading my page and i want when moving between pages the embeded player to continue playing without interuption..)If i stepped over any rule i want to excuse me and please let the topic exist until someone help me...thankz in advance Link to comment Share on other sites More sharing options...
jeffman Posted March 5, 2009 Share Posted March 5, 2009 Don't worry about the topic. It will exist until Doomsday.For your first problem, you're going to have to post your document. I have some suspicions, but there's no sense going into them without a better idea what you're up against.As to the second: Usually, if you have the same layout and images at the top of a bunch of pages, the caching feature of modern browsers will create the illusion that the page stays put, and only the content areas change.Because that can be a hassle after 3+ pages, we can use server-side scripting to automate things. Do you have access to PHP or ASP? You don't need to know much of the language to make this work.The music thing is a toughy. 10 years ago we would have used frames for that trick. And since frames still exist, you still can. But frames are deprecated, so you'll have to make a decision. The best way to do it would be to use a technique called AJAX. This is a way of keeping your page in the browser (so things like music players wouldn't have to reload) and only updating the content you need to update. But AJAX is not for beginners. You'll need a solid grip on both Javascript and a server-side language to understand it. Link to comment Share on other sites More sharing options...
bobi93 Posted March 5, 2009 Author Share Posted March 5, 2009 Hmm... i didn't know how to post some of the files so i uploaded them on a server.The site isnt in english but u don't need to understand it. I added only the index and one more page(completely simple..) I don't know PHP but i may learn the basics. Can u give me a link with some help about making this or smth,or u will explain me ?About the music,i don't mind if it's an ancient way of making it work.I don't know what that frames are,so if u can help me with them too..it would be very nice Link to comment Share on other sites More sharing options...
jeffman Posted March 5, 2009 Share Posted March 5, 2009 Well, I'm not downloading an unknown file. But you can paste your text right into the message here. Like this:[code]paste your code here[/code]As for PHP and frames, the tutorials right here have good tutorials to get you started. http://www.w3schools.com/ Link to comment Share on other sites More sharing options...
bobi93 Posted March 5, 2009 Author Share Posted March 5, 2009 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <center><head><center><img src="daira.jpg"></center><title>Начало</title><body bgcolor="white" text="black"><meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <style type="text/css"> body {padding: 0px; margin: 150px 0px 0px 0px;} ul.main { width: 678px; height: 150px; border: 1px solid #C1C1C1; padding: 1px; list-style-type: none; } ul.main li {float: left;} a.btn { display: block; width: 135px; height: 80px; background-color: #E5E5E5; padding-top: 70px; font-size: 10px; font-family: Verdana, Arial, serif; text-decoration: none; color: #333; } a.btn:hover {background-color: pink; color: white;} </style> <script type="text/javascript"> function changeWidth(param1, param2, param3, param4, param5) { document.getElementById('btn1').style.width=param1+"px"; document.getElementById('btn2').style.width=param2+"px"; document.getElementById('btn3').style.width=param3+"px"; document.getElementById('btn4').style.width=param4+"px"; document.getElementById('btn5').style.width=param5+"px"; } function normalWidth() { document.getElementById('btn1').style.width=135+"px"; document.getElementById('btn2').style.width=135+"px"; document.getElementById('btn3').style.width=135+"px"; document.getElementById('btn4').style.width=135+"px"; document.getElementById('btn5').style.width=135+"px";} </script> </head> <body> <center><ul class="main"> <li style="margin-right: 1px;"> <a href="index.html" class="btn" id="btn1" onmouseover="changeWidth(179, 124, 124, 123, 124);" onmouseout="normalWidth();">Начало</a> </li> <li style="margin-right: 1px;"> <a href="shop.html" class="btn" id="btn2" onmouseover="changeWidth(124, 179, 124, 123, 124);" onmouseout="normalWidth();">Магазин</a> </li> <li style="margin-right: 1px;"> <a href="stock.html" class="btn" id="btn3" onmouseover="changeWidth(124, 124, 179, 123, 124);" onmouseout="normalWidth();">Стоки</a> </li> <li style="margin-right: 1px;"> <a href="f_shui.html" class="btn" id="btn4" onmouseover="changeWidth(124, 124, 123, 179, 124);" onmouseout="normalWidth();">Фън Шуи</a> </li> <li style="margin-right: 0px;"> <a href="hot.html" class="btn" id="btn5" onmouseover="changeWidth(124, 124, 124, 123, 179);" onmouseout="normalWidth();">Горещо</a> </li> </ul> </center> <center>Добре дошли при сивото слонче с името Дайра. То носи късмет и приятни мигове на всеки, който го посети. То работи за вас.</center><!-- BEGIN Windows Media Player --><center><object id="MediaPlayer1" width=180 height=50 position"bottom"classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701"standby="Loading Microsoft® Windows® Media Player components..." type="application/x-oleobject" align="middle"><param name="FileName" value="Celtic_Dream.mp3"><param name="AutoStart" value="false"><param name="ShowStatusBar" value="False"><param name="DefaultFrame" value="mainFrame"><param name="Volume" value="100"><PARAM NAME="ShowAudioControls" VALUE="True"> <PARAM NAME="ShowPositionControls" VALUE="False"><!-- BEGIN PLUG-IN HTML FOR FIREFOX--><embed type="application/x-mplayer2" pluginspage = "http://www.microsoft.com/Windows/MediaPlayer/"src="Celtic_Dream.mp3" align="middle"width=176height=144defaultframe="rightFrame"showstatusbar=false></embed><!-- END PLUG-IN HTML FOR FIREFOX--></object></center><!-- END Windows Media Player --></body> </html> Link to comment Share on other sites More sharing options...
Jerry62704 Posted March 5, 2009 Share Posted March 5, 2009 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <center><head><center><img src="daira.jpg"></center><title>Начало</title><body bgcolor="white" text="black"><meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> Take the center and img out of the head section. They go in the body section. Link to comment Share on other sites More sharing options...
bobi93 Posted March 6, 2009 Author Share Posted March 6, 2009 I tried that before...the img stays down again " <body> <center><img src="daira.jpg"></center><center> <ul class="main"> <li style="margin-right: 1px;"> " etc..... The quotes " " aren't included in the html file Link to comment Share on other sites More sharing options...
Pollux Posted March 6, 2009 Share Posted March 6, 2009 The problem is the line of CSS in your head: body {padding: 0px; margin: 150px 0px 0px 0px;} This adds a margin of 150px at the top of your body. The body is the visible bit of your page, which is why you need to put the image and center tags inside there not the head. The easy solution is just to remove this line completely, or alternatively you could change the "150px" to "0px". That will stop your logo being pushed down. Link to comment Share on other sites More sharing options...
bobi93 Posted March 8, 2009 Author Share Posted March 8, 2009 Oh... that was a solution thankz man... If only i knew what "margin" means it would have crossed my mind to put it to 0px but... If i have more problems in the near future i will write to you again Link to comment Share on other sites More sharing options...
boen_robot Posted March 8, 2009 Share Posted March 8, 2009 Oh... that was a solution thankz man... If only i knew what "margin" means it would have crossed my mind to put it to 0px but... If i have more problems in the near future i will write to you againRead the CSS tutorial for explanation of margin and many others. You'll also see that there will be no need for the <center> element once you learn it.BTW,Добре дошли при сивото слонче с името Дайра. То носи късмет и приятни мигове на всеки, който го посети. То работи за вас.Пхахаха... извинявай, просто ми е много смешно. Освен ако това не е сайт за някаква фирма, която има подобно чудо от векове, това звучи като голяма идиотщина .To everyone else (sorry bObi, but this is too precious to leave people in the dark ), the text above says "Welcome to the gray elephant named Daira. It brings luck and pleasent moments to anyone that visits it. It works for you."... this sounds even funnier in Bulgarian than in English for me . Link to comment Share on other sites More sharing options...
bobi93 Posted March 8, 2009 Author Share Posted March 8, 2009 BG:Ами да това е сайт за едно малко магазинче Дайра ,затова а не разбрах това за вековете на кое се смееш :)UK: Yes that's a site for a small shop in my town... :(The code of the javascript menu is posted a little posts before that and you can see it.I don't know why but it looks like a little bit different in Mozilla/Opera... the last part of the menu is not in its place... can anybody tell me what should i change in the code Link to comment Share on other sites More sharing options...
boen_robot Posted March 8, 2009 Share Posted March 8, 2009 <li style="margin-right: 1px;"> <a href="f_shui.html" class="btn" id="btn4" onmouseover="changeWidth(124, 124, 123, 179, 124);" onmouseout="normalWidth();">Фън Шуи</a> </li> <li style="margin-right: 0px;"> <a href="hot.html" class="btn" id="btn5" onmouseover="changeWidth(124, 124, 124, 123, 179);" onmouseout="normalWidth();">Горещо</a> </li> Note the line <li style="margin-right: 0px;"> and compare it to your other ones <li style="margin-right: 1px;"> See the difference? Everyone else uses 1px. At least that as far as I can gather from just looking at the code.А иначе ми е смешно тъй като всичко това ми звучи много инфантилно... даже и да продават детски играчки (което би обяснило "слонче"-то), "носи късмет и приятни мигове" звучи все едно говорят на бебета (които иначе не могат да четат, убивайки идеята да им се говори така). Под "от векове" имах в предвид ако вече това слонче и останалото са им като запазена марка, т.е. навлезли са в съзнанието на клиентите им (тъй наречения "branding"). Ако е така, би било лоша идея да се правят промени, тъй като много хора ще се чудят за същият магазин ли става въпрос. Link to comment Share on other sites More sharing options...
bobi93 Posted March 10, 2009 Author Share Posted March 10, 2009 I tried setting this to 1px but it's the same in Mozilla... nevermindI found an explanation of the use of frames and i tried using them... Is it normal for frames to visualize in the explorer a line which can be controled by the visitor...I open the html file and i can move this line where i want to...Can i change this? Link to comment Share on other sites More sharing options...
boen_robot Posted March 11, 2009 Share Posted March 11, 2009 I found an explanation of the use of frames and i tried using them... Is it normal for frames to visualize in the explorer a line which can be controled by the visitor...I open the html file and i can move this line where i want to...Can i change this?Yes. It's normal. You can make it non-resizeable with the noresize attribute:<frame noresize="noresize" ...> I'd try to help with this offset thingy (as frames are not a good thing to use for various reasons), but... could you post a link to the page or something? Visual bugs are usually much easier to investigate on the actual page than to use the source code. Link to comment Share on other sites More sharing options...
bobi93 Posted March 11, 2009 Author Share Posted March 11, 2009 okay that's the link to my index.html ... It would be great if you help me with it... i will even learn something new :)P.S. I tried using "noresize" and it's ok but is there any way that i can use to remove that line from the interface of the site Link to comment Share on other sites More sharing options...
boen_robot Posted March 11, 2009 Share Posted March 11, 2009 okay that's the link to my index.html ... It would be great if you help me with it... i will even learn something new :)P.S. I tried using "noresize" and it's ok but is there any way that i can use to remove that line from the interface of the site A download link is not what I had in mind. I mean for you to actually publish it... you know, like hit.bg and the like...You can remove the frame border by addingframe {border:none;} within your <style> element in your frameset HTML file (i.e. the file that has all "frame" elements in it). Link to comment Share on other sites More sharing options...
bobi93 Posted March 11, 2009 Author Share Posted March 11, 2009 I don't have style in my frameset so i found and used frameborder="no" ... :)sorry... here it isAbout the frames,what must the structure of a html file (part of a frameset) be.For more info - it will be the part that will be the same in every page,i mean the menu... does it need <html> , <head> , <body> or smth else? Link to comment Share on other sites More sharing options...
Tykain Posted March 11, 2009 Share Posted March 11, 2009 The structure of an html file meant to be displayed within frames should be the same as for a regular html file. Link to comment Share on other sites More sharing options...
bobi93 Posted March 12, 2009 Author Share Posted March 12, 2009 Hmm that's cross.. So when i wanna use frames in every page i will have to use the frame tags to call the separate parts of the frameset...? And what about the main frame tag - i mean <frameset rows="237,*" frameborder="no"> Does it need to be in the <head> or <body> ? Link to comment Share on other sites More sharing options...
Tykain Posted March 12, 2009 Share Posted March 12, 2009 The frameset should look something like this : <!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"><html><frameset rows="20%,80%" frameborder="0"> <frame src="menu.htm" name="menu_frame"> <frame src="content.htm" name="content_frame"><noframes><body>Your browser doesn't support frames or is configured not to show them.</body></noframes></frameset></html> Pages that will be displayed inside the frames should have the same structure as for any regular html file.Don't forget to specify the target for your links in the menu so that they open in the right frame. Link to comment Share on other sites More sharing options...
bobi93 Posted March 17, 2009 Author Share Posted March 17, 2009 Hey,i'm now trying to make a page like a simple gallery.I want to make it show pictures,for instance, with resolution 320x240 but when you click on it to show it bigger (480x640) . How should i do this in order to open the page faster.Shall i use 2different files for that job (1pic with smaller res. and 1 with bigger) or just do it with a command that resizes the picture...I ask because i'm not sure if the browser will load faster the picture if it's just resized.. Link to comment Share on other sites More sharing options...
Ingolme Posted March 17, 2009 Share Posted March 17, 2009 Use a small file and a big one. It will be easier on the browser. Link to comment Share on other sites More sharing options...
Synook Posted March 18, 2009 Share Posted March 18, 2009 Also, browser resizing produces horrible quality pictures. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.