Jump to content

amitamberker

Members
  • Posts

    599
  • Joined

  • Last visited

Posts posted by amitamberker

  1. Hi niche, dsonesuk and DDs1,
    Here is the Updated version of CODE. Before seeing the CODE from your Browser, I would request you to Download and Keep the "MyDesign.png" file Opened from your MS Paint to View it 100%.
    So, am I doing it Correct? Do I need to Change anything? What should I do?
    Please help.
    <!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 http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>P S</title><style type="text/css">body {margin-top: 0px;margin-bottom: 0px;background-color: #891e90;/*background-image: url('images/XXX.png');background-repeat: repeat-x;background-attachment:fixed;*/}#container01 {width: 960px; /*height:500px;*/;background-color: #FFFFFF;overflow: auto;margin: 0 auto;}.Testing01 {width: 470px;float: left;background-image: url('images/Title_Bar_for_Eye_Image.jpg');background-repeat: no-repeat;height: 43px; }.Testing02 {float:left;width:23px;}.Testing03 {width:178px;float:left;height:353px;background-color:#54dc61;text-align: center;}.Testing04 {float:left;width:23px;}.Testing05 {float:left;width:266px;height:353px;background-color:#d5f7ab;}.FloatLeft {float:left;}.FloatRight {float:right;}.Testing06 {position: absolute;float: left;}.Titles {padding-left: 16px;font-family: Arial;font-weight: bold;font-size: 13.5pt;line-height: 42px;}.FirstFrameBottom {background-image: url('images/FirstFrameBottom.png');background-repeat: no-repeat;width: 470px;height: 27px;}.FirstFrameRight {background-image: url('images/FirstFrameRight.png');background-repeat: no-repeat;width: 23px;height: 353px;}.FirstFrameCorner {background-image:url('images/FirstFrameCorner.png');background-repeat:no-repeat;width:23px;height:27px; }.TitleBarForEye {   background-image:url('images/Title_Bar_for_Eye_Image.jpg');   background-repeat:no-repeat;   width:470px;   height:43px;     }.Titles {padding-left: 16px;font-family: Arial;font-weight: bold;font-size: 13.5pt;line-height: 42px;}.BG01 {background-image: url('images/bg01.png');background-repeat: repeat-x;height: 27px;}.BG02 {background-image: url('images/bg02.png');background-repeat: repeat-x;height: 996px;padding-right: 15px;padding-left: 15px;padding-top: 24px;}.style1 {background-repeat: repeat;font-family: "Comic Sans MS";font-size: 12pt;text-align: justify;}.DropCap {font-family: "Comic Sans MS";font-size: 19pt;font-weight: bold;}</style></head><body><div id="container01"><div style="width:470px;float:left;"><div class="TitleBarForEye"><span class="Titles">Title 01</span></div><div><img alt="" src="images/EyeImage.jpg" width="470" height="310" /></div><div class="FirstFrameBottom"></div></div><div style="width:23px;float:left"><div class="FirstFrameRight"></div><div class="FirstFrameCorner"></div></div><div style="width:178px;float:left"><div style="background-color:#54dc61;height:380px"><ul><li>01</li><li>02</li><li>03</li><li>04</li><li>05</li><li>06</li><li>07</li><li>08</li> </ul></div></div><div style="width:23px;float:left"><div style="background-color:blue"><img alt="" src="images/Frame02.png" width="23" height="353" /></div><div style="background-color:gray"><img alt="" src="images/FrameCorner02.png" width="23" height="27" /></div></div><div style="width:266px;float:left"><div style="background-color:#d5f7ab;height:353px">Testimo</div><div style="background-color:orange"><img alt="" src="images/Frame04.png" width="266" height="27" /></div></div><div> <!-- Add this into the DIV style="background-color:black" and Remove the Eye Image and Title Bar Image to Check the Black Color. FIX it Accordingly --><div style="width:470px;float:left"><div class="BG01"></div><div class="BG02"><p class="style1"><span class="DropCap">I</span> w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... </p> <p class="style1"><span class="DropCap">C</span>w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... </p><p class="style1"><span class="DropCap">H</span>w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... w3Schools... </p><p class="style1"><span class="DropCap">J</span>w3Schools...  specialises in</p><p class="style1">• w3Schools... <br />• w3Schools... <br />• w3Schools... <br />•   w3Schools... <br />• w3Schools... <br />• w3Schools... <br /></p></div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div></div><div style="width:224px;float:left"><div>...4 Icons</div><div>...Reflection of Icon</div><div>...Back-Up div Tag</div><div style="height:996px;background-color:#54dc61">height: 996px;</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div></div><div style="width:266px;float:left"><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div><div>...</div></div><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /></div><div style="height:100px">FOOTER</div></div></body></html>
  2. Here is my Updated CODE but please Keep the "MyDesign.png" file Opened for Reference.

    <!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 http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>P S</title> <style type="text/css"> body {margin-top: 0px;margin-bottom: 0px;background-color: #891e90;/*background-image: url('images/XXX.png');background-repeat: repeat-x;background-attachment:fixed;*/ }#container01 {width: 960px;/*height:500px;*/background-color: #FFFFFF;overflow: auto; margin: 0 auto;}.Testing01 {width: 470px;float: left;background-image: url('images/Title_Bar_for_Eye_Image.jpg');background-repeat: no-repeat;height: 43px; }.Testing02 {float:left;width:23px;}.Testing03 {width:178px;float:left;height:353px;background-color:#54dc61;text-align: center;}.Testing04 {float:left;width:23px;}.Testing05 {float:left;width:266px;height:353px;background-color:#d5f7ab;}.FloatLeft {float:left;}.FloatRight {float:right;}.Testing06 {position: absolute;float: left;}.Titles {padding-left: 16px;font-family: Arial;font-weight: bold;font-size: 13.5pt;line-height: 42px;} </style> </head> <body> <div id="container01"><div class="FloatLeft"><div class="Testing01"><span class="Titles">Title 01</span></div><div class="Testing06"><img src="images/XXX.jpg" width="470" height="310" /></div></div><div class="Testing02"><img src="images/Frame01.png" /></div><div class="Testing03"><img alt="" src="images/XXX.png" width="122" height="32" /><br /><img alt="" src="images/XXX.png" width="122" height="32" /><br /><img alt="" src="images/XXX.png" width="122" height="32" /><br /><img alt="" src="images/XXX.png" width="122" height="32" /><br /><img alt="" src="images/XXX.png" width="122" height="32" /><br /><img alt="" src="images/XXX.png" width="122" height="32" /><br /><img alt="" src="images/XXX.png" width="122" height="32" /><br /><img alt="" src="images/XXX.png" width="122" height="32" /></div><div class="Testing04"><img src="images/Frame02.png" /></div><div class="Testing05">Testimonials</div><div>2nd Phase</div><div>Footer Segment</div></div> </body> </html>
    1. The DIV tag of "Title 01" is Hiding behind - <div class="Testing06"><img src="images/XXX.jpg" width="470" height="310" /></div>... How should I make "Title 01" visible?2. How should I give Space between Navigation Buttons?
  3. ur png file is a 3 column template, so therefore you need to make a 3 column html template
    Hi DDs1, Thanks for your Response. But how do Incorporate those Border Frames which is at the Top Segment? So, you mean I should put 1 Container and 3 DIVs with FLOAT attribute? Kinda I am little bit Confused. Not able to Decide how to Start it.
  4. Hi dsonesuk, How are you doing? I hope All is Well at your End. Please forgive Me if you can. I am Sorry. Could you please check My Post into "HTML/XHTML" Segment? Somehow I am not able to Decide about constructing Containers and DIVs for My Design :facepalm: By the way, could you please Allow me to Send you Private Messages?

  5. Hi niche, Thanks for your Response.

    <!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 http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>P S</title> <style type="text/css"> body {margin-top: 0px;margin-bottom: 0px;background-color: #891e90;/*background-image: url('images/XXX.png');background-repeat: repeat-x;background-attachment:fixed;*/ }#container01 {width: 950px;background-color: #FFFFFF;overflow: auto;margin: 0 auto;} </style> </head> <body> <div id="container01"><div>Big Pic along with Faded Title Bar on the Top Left Corner | Big Pic's Right Frame Bar | Navigation Menu (8 Buttons) | Left Frame Bar | Testimonials Segment</div><div>...</div><div>Footer</div></div> </body> </html>
  6. Updated as in, copied my example code and just pasted into your page? didn't do much did it. create FUNCTIONS (prev() and next()) for calling upon when previous and next buttons are clicked, these will increase or decrease current_img variable value, and also check its value is between 0 and img_total -1. ADD ALL images you wish to show in the div container below AND (most important!) give id ref, which is referenced here var parent_frame = document.getElementById("pic_frame");
     <div id="pic_frame"><img alt="Product 1" src="images/prod1.jpg" width="272" height="326" /><img alt="Product 2" src="images/prod2.jpg" width="272" height="326" /><img alt="Product 3" src="images/prod3.jpg" width="272" height="326" /></div> 

    Hi dsonesuk,Could you please try to Explain Again in a Different and More Easier Way?1. How should I create FUNCTIONS (prev() and next()) for calling upon when previous and next buttons are clicked?2. Where / How should I check the Value is between 0 and img_total -1?3. You mean, I should ADD ALL the Images Underneath This?<div><img alt="Product 1" src="images/prod1.jpg" width="272" height="326" /></div>4. You mean, I should give ID reference in the Container?5. When you said - "which is referenced here var parent_frame = document.getElementById("pic_frame");", I understood what you mean by that.
  7. first you need to define starting variable var current_img=0; you then insert all the images within the div container (give it a id ref as in 'pic_frame') and use display:none to hide them all. use javascript to workout how many images you have placed in div container.
    var parent_frame = document.getElementById("pic_frame"); //target parent containerchild_images = parent_frame.getElementsByTagName("img"); // target all img element within parent frame ('pic_frame')child_images[0].style.display="block"; //show first image - starts at 0img_total=child_images.length; // get total of img tags found

    add onclick event to prev and next that will run respective functions prev() will decrease (current_img--) by 1, whereas next() will increase (current_img++) by 1. As each function is run to increase or decrease the current_img value, you will also check to see if this value is lower than 0 (then change to total images found -1), if value greater than total images found -1 change to 0; then loop through all images and hide using display none, then show image determine by value of current_img

    	for(i=0;i<child_images.length;i++)		{		child_images[i].style.display="none";		}	child_images[current_img].style.display="block";

    Hi dsonesuk,Here is the Updated CODE:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url="http://www.w3.org/TR...ransitional.dtd"]http://www.w3.org/TR...ransitional.dtd[/url]"> <html xmlns="[url="http://www.w3.org/1999/xhtml"]http://www.w3.org/1999/xhtml[/url]"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Rotating Images</title> <style type="text/css"> #container { border: 1px solid #C3C3C3; width: 272px; margin: 0 auto; } .FloatLeft { float:left; } .FloatRight { float:right; } .NoBorder { border-width: 0px; } </style>  <script type="text/javascript">/*<![CDATA[*/var current_img=0;var parent_frame = document.getElementById("pic_frame"); //target parent containerchild_images = parent_frame.getElementsByTagName("img"); // target all img element within parent frame ('pic_frame'child_images[0].style.display="block"; //show first image - starts at 0img_total=child_images.length; // get total of img tags foundfor(i=0;i<child_images.length;i++){child_images[i].style.display="none";}child_images[current_img].style.display="block";/*]]>*/</script> </head> <body> <div id="container"> <div> <span class="FloatLeft"><a href="#"><img alt="" src="images/prev.jpg" width="29" height="29" class="NoBorder" onclick="(current_img--) by 1" /></a></span> <span class="FloatRight"><a href="#"><img alt="" src="images/next.jpg" width="29" height="29" class="NoBorder" onclick="(current_img++) by 1"/></a></span> </div> <div><img alt="Product 1" src="images/prod1.jpg" width="272" height="326" /></div> </div> </body></html>

  8. You need to store all of the image URLs in an array in the order you want them to appear. The function that you run when you click next or previous should get the URL that is currently shown, find it in the array, and get either the next or previous URL in the array to set for the img element.
    Hi justsomeguy,Could you please provide me some reference links?
  9. Hello JavaScript Experts, Greetings! What should I do to make this Change upon Clicking Next and Previous Buttons? There are 2 more Files inside "images" Folder: * rod3.jpg* rod6.jpg

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR...ransitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Rotating Images</title><style type="text/css">#container { border: 1px solid #C3C3C3; width: 272px; margin: 0 auto;}.FloatLeft{ float:left;}.FloatRight{ float:right;}.NoBorder { border-width: 0px;}</style> </head><body><div id="container"><div><span class="FloatLeft"><a href="#"><img alt="" src="images/prev.jpg" width="29" height="29" class="NoBorder" /></a></span><span class="FloatRight"><a href="#"><img alt="" src="images/next.jpg" width="29" height="29" class="NoBorder"/></a></span></div><div><img alt="Product 1" src="images/prod1.jpg" width="272" height="326" /></div></div></body></html>
  10. feel free to learn to use the internets http://en.wikipedia....-line_interface http://en.wikipedia.org/wiki/OS_X you can still use command line in windowshttp://www.sevenforu...and-prompt.html but the command is different
    > dir /s *.mp3

    All I was providing was an alternative to what had been suggested. Command line is a simple way to work with an OS, since all you needed was a simple list of files to paste into a text file, and not in the context of a web application (i.e. not having to write a PHP script).

    Hi thescientist,Thank you very much!... By the way I do use Internet everyday to get required information and etc :) lol... But anyways, thanks!
  11. one way could be using php scripts to generate the text file with list of mp3 file name.you can use glob() to get the file from a directory and the use file_put_contents() to write it to file. you can also use pathinfo() to parse the file name from the location of the file which is retrned from glob() reference:http://php.net/globhttp://php.net/file_put_contentshttp://php.net/pathinfo
    Hi birbal,Means? How should I do it?
  12. The reason i have not put in my cents worth, is that the answer has already been provided, change files to php and use include(), thats it done! install wamp on local pc, so you can see the result on local server instead of uploading to host server done! problem solved, which has already been stated before, if you can't be bother to take the advice provided, then that is your problem, we have done our bit.
    Hi dsonesuk,Thanks for your reply. I know all the members have done their bit. Even I tried my best to follow them. I changed to php and used include(), but it was not done. I had installed wamp on my Dell Inspiron 1520 Laptop to see the result but somehow I could not see the results. Perhaps I was doing something wrong. But yes, I tried to the best of my ability but failed to succeed. And hence, I gave-up. Few weeks ago I opened all the HTML Files and Chanced the "Copy Right" info 1 by 1 in all the HTML Pages manually. Next Year (2013) again I have to open all those HTML Pages and Update "Copy Right" info manually in all the pages.
×
×
  • Create New...