|
HTML - Simulate Website At 1/2 Size For Gallery Purposes?
Does anyone happen to know if there is a way, other than resizing everything in a site manually, to display a website layout at half size but still functional?
Basically what I want to do is display my design work on my site, but at only half size so that it 1) it fits within *my* design and 2) it is obvious that it is not the actual website. Taking screenshots is all well and good, but they really don't display the actual functionality of the website--CSS rollovers, etc. So I'd like to be able to pull up the actual code within either a div or an iframe. Is this something someone has already thought of and invented a solution? Similar TutorialsI'd like to add a nice photo gallery to the website I'm building. I'm semi familiar with building a gallery in wordpress with a plugin & embedding the code into my main website, but I dont want to go that route for this new website I'm building as its not going to reside on wordpress & I want it everyting situated on one server with one main file. So what options are out there for me to add a nice gallery to a website? Hello everyone again, I have searched everywhere to get the info to make the website adapt to the resolution size. I can not understand how it works. Will someone please be able give me the info on how to make the website adapt to the resolution. Thanks for all of your help How do you make the website The same size on different resolution? Thanks for all of your help. My website will have a picture that is cut in 3 parts (see below for the chop up). now my question is. I want the sides to gradually disapear if the browser window becomes smaller, as the main part of the website is displayed on the middle part of the website Say that the total size of the image is 1300px. and the respectively from left to right. the picture is chopped up in 250px - 800px - 250px. now if the browser is wide enough it would just show the whole 1300px of the website. however if the browser is at most able to show 1000px of the website, the side would reduce corespondingly showing the website as 100px - 800px - 100px. and that offcourse that the picture on the left side doesn't look weird. I hope everything is still clear. it bassically means that of the 250px of the left picture, the picture would be cut up from left to right, rather than the default right to left. thus cutting 150px away from the left and not the right. leaving the colors in the picture below, continue on flowing like they should. How would I go about doing this? Hey guys im sure this question has been answered, but having tried a large majority of the answers none seem to work. I have been building websites using my laptop (15 inch screen) after upgrading to a 17 inch screen im getting problems with the web page. It now has a horizontal scroll bar which i find rather annoying as do many other people that visit my sites. This is what it looks like at the moment on larger screens what i need to find out is how to make it so the page fits within the parameters of the screen without a horizontal scroll bar. this is the code that i used to make on of my sites, if possible could some one tell me where to maybe edit the string of html to get it to fit all screens? <html> <head> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <title></title> </head> <body style="color: rgb(255, 255, 51); background-color: rgb(0, 0, 0);" alink="#ffff33" link="#ffff33" vlink="#ffff33"><div style="text-align: center;"><img style="width: 750px; height: 225px;" alt="" src="http://i488.photobucket.com/albums/rr248/kingofkingspoker/PCKBIGBANER-1.png"><br> <big><br> Home | Investigations | Gallery | Locations | The Team | Methods | Contact us<br> <br> </big> <table style="width: 800px; text-align: left; margin-left: auto; margin-right: auto;"> <tbody> <tr> <td style="text-align: center;"> <div align="center"><font color="#000000" size="+1"> <marquee bgcolor="#FF0000" direction="left" loop="99999" width="75%"><strong>We are accepting private bookings. Please contact Tim Harris on 07533119768 or email Tim at tim.paranormalknights@yahoo.co.uk</strong></marquee> </font></div> </td> </tr> </tbody> </table> <big><br> </big> <table style="background-color: rgb(0, 0, 0); text-align: left; margin-left: auto; margin-right: auto; width: 1312px; height: 459px;"> <tbody> <tr> <td style="text-align: center; vertical-align: top;"> <div style="margin-left: 40px;">Hello and welcome to Paranormal Knights Cymru. The group was founded in 2008 with the soul intentions of finding answers that we the team have been searching for, for all our lives! We are a unique team that reside in the south Wales area and have many many years of paranormal investigating experience between us. The things that make us such a unique team of paranormal investigators is that we take things to a higher level, we go to such a high level that other teams are left stranded whilst we soar above and beyond the grave. We use techniques such as Clairvoyance, Clairaudiance, Clairsentience and also the scientific approach with electronical equipment such as EMF detectors, EVP recording devices, still camera's and also video camera's. We also use non electrical equipment such as dowsing rods, oujia boards, glass swirling and table tipping. All of these methods are tried and tested and proven to be the main source of communications with the paranormal phenomena. To get an understanding of what these techniques entail and how they work please check out the methods page. <br> <br> So with that said will you be able to put the fear of the unknown behind you and join us in our quest for answers?<br> <br> <span class="Apple-style-span" style="border-collapse: separate; color: rgb(0, 0, 0); font-family: 'Times New Roman'; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; font-size: medium;"><span class="Apple-style-span" style="color: rgb(51, 0, 153);"></span></span><span class="Apple-style-span" style="border-collapse: separate; color: rgb(0, 0, 0); font-family: 'Times New Roman'; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; font-size: medium;"><span class="Apple-style-span" style="color: rgb(51, 0, 153);"></span></span></div> </td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td style="text-align: justify; vertical-align: top;"><img style="width: 498px; height: 253px;" alt="" src="http://i488.photobucket.com/albums/rr248/kingofkingspoker/Margam_Castle.jpg"></td> <td></td> <td></td> </tr> </tbody> </table><div style="text-align: left;"><br> </div> <br> </div> </body> </html> My new website test pages are at: http://www.monkeygambling.com/new%20pages/index.shtml I have a small probelm with the menu on the left side. It is not vertically aligned. The reason why is that I have an empty table inserted above it. This table is quite important as it makes the search engine spider miss the left menu out and move to the central section. My question is, is there a way to make this table exisit with no size (e.g. height =0), or just be there without affecting anything else? thanks Hi guys, I'm currently trying to sort out the background for a website. What I'd like is to have a silhouette of a few people on a gradient background. I'd like to keep the quality high, but it also makes the file size large. If there were no silhouette then I would have a one pixel strip of the gradient set to repeat. Is it possible to add two background pictures, or is there another way I can reduce the file size that I hadn't thought of? I have been trying to merge two command scripts, and have gotten nothing. I am trying to use javascript commands to open a new window on Firefox, and on that opened window simulate a Tab key press. This is the full script that I have come up with so far to open two windows, with the websites being yahoo.com and google.com. ***To fully help me please copy this script, paste to Notepad, save as a .html file and run it on Firefox. You will notice a "Open Windows" button will appear. When you click on it the windows will open: <html> <head> <script type="text/javascript"> function open_win() { window.open("http://yahoo.com", "newwindow1") window.open("http://google.com", "newwindow2") } </script> </head> <body> <form> <input type=button value="Open Windows" onclick="open_win()"> </form> </body> </html> Now this is what I have come up to simulate a Tab key event when you press the ENTER key: <script language="javascript> function fakeTab() { if (window.event.keyCode == 13 && window.event.srcElement.tagName == "INPUT") window.event.keyCode = 9; } documet.onkeydown = fakeTab; </script> What I want to do is merge these two scripts, so that when I press that "Open Windows" button, the new window opens and the Tab key press is immediately simulated to move to the next field on the webpage. I understand that JavaScript is event driven, meaning some event has to occur before you can make things happen. The user must push a key or click somewhere on the page before you can relaly do anything with an event. I want to have the clicking of the "Open Windows" button, that first triggering event which opens a window and simulates the tab key press on that window. I am creating a mobile website (yes it uses script...yes i know thats not universal). Anyway. I have a picture of a car with call outs on it...the call outs all of a corresponding link below the car that is an accordion drop down. I want to be able to press on the number that has to do with say fuel tank...and have it actually open that section not just take me to where it is... test link is www.schenkhampton.com/airtex2/fueldelivery.html Any ideas would be appreciated. Matt i have 2 frames in my parent frame say 1.htm ie left frame and 2.htm ie right frame now this 1.htm is quite a long frame and has a scrollbar and 2.htm is a short one i dont the scroll bar beside my frame 1 but want it to be for my entire parent window ie i wont to scroll both my left and right frames together how do i do that Hi! I have a page that contains a text area. What I want it to do is to change its size according to the size of the browser window. How can I make it do that? I did it once but just can't seem to remember how I did it. Thanks All: Working to update a previously designed website. Original design uses an <img> tag to create a top banner and another <img> tag to create a side banner. In each case there are mapped coordinates on each banner as links for the subsequent pages. Basic page design is as follows: Code: <table>
<tr>
<td>
<img usemap="Map1">
<map name="Map1">
<area>
<area>
<area>
</map>
</td>
</tr>
</table>
<table>
<tr>
<td>
<img name="Map2">
<map>
<area>
<area>
<area>
</map>
</td>
<div>
***PAGE CONTENT***
</div>
<tr>
<table>
The challenge is that the [PAGE CONTENT] varries in length througout the site causing some pages to be much longer or shorter than others. This causes some inconsistencey in the relationship between the side banners height and the page content. In other words in some cases the banner is exceptionally longer than the page content and the reader must scroll past significant "dead-space" before being brought to the lowest mapped links in the side banner; or... ...in some cases the side banner is significantly shorter than the page content causing the banner image to appear "poorly-fit" to the page design. I considered altering the 2nd table instance in the above design so that the banner is carried in a <td> tag that is adjacent to the page content and hopefully to allow the tag carrying the image to size relative to the <td> tag carring the content.... Code: <table>
<tr>
<td>
<img usemap="Map1">
<map name="Map1">
<area>
<area>
<area>
</map>
</td>
</tr>
</table>
<table>
<tr>
<td size="100%">
<img name="Map2">
<map>
<area>
<area>
<area>
</map>
</td>
<td size="100%" >
<table>
***PAGE CONTENT***
</table>
</td>
<tr>
<table>
The problem I've found with this is that as the content size causes the image to "flex", either readablilty or image quality or both are effected, AND the mappings become inconsistent as the image coordinates constantly change. I've considered 2 solutions and am leaning toward one, but thought I'd post this and see if there are better ideas I'm overlooking. One idea was to add additional table rows inside the [PAGE CONTENT] table presumably creating a "defalut" page size that would never be smaller than a standard for the side banner. Problem: larger page sizes are still a problem as are the changing map coordinates My other idea was to return to the original page design listed first above and again settle on a standard side banner "height"... ...any page that was significantly longer than that height would be split to 2 or more pages with a [NEXT>>] button at the bottom of the page navigating to the additional content. Problem: ...possible complications splitting content... Benefit: ...consistent page design that allows a consistent side banner with navigable links... Question for the group: Does this sound reasonable? Are there better alternatives I am overlooking? THANKS IN ADVANCE FOR ALL INPUT!! I'm building a website and i'm new to this. I want to build a gallery section on my site. Here's how I want it to work. I want people to be able to upload there own pictures in it themselves. It's main page will be the thumbnails with small description deside it. When a thumbnail is clicked, it open a pop-up with the picture with a resolution of 600x400 with description under it the person added while uploading the picture. After when the 600x400 picture is clicked that pop-up window will closed and another one with its orginal resolution will open. Clicking again will cause is to close. I also want to add a search engine in there with search options such as category, newly added, latest added, user... If anyone know ann extention for dreamweaver for it or something with frontpage please let me know. any help at all will be appreciated and thanked. I'm trying to create a web page that allows my thumbnail photos to link to an enlarged version of the same image right above the thumbnails. So lets say I have 4 thumbnails lined up, I could click on either one, and a larger version of the image would appear, centered, above. If I clicked another image, the previous enlarged image would go away, and the newly clicked image would display, enlarged, in place where the last one was. I know you can do something similar with a mouseover code with Java script. I'm looking to strictly create something for a single page with HTML. Anyone have some insight? I was wondering if it was possible to past an Image over an image WITHOUT backround img code. But my MAIN q. was if there was a win7 equivelant to galleryimage=no. Hi, Does anyone know how you make a gallery to this one http://www.suecorr.com/page2.htm, where the image pops up when you click on it and darkens the background, and also gives you the option to move on to the next image. Thanks Dyfrig Hello to everyone, Brand new here and need help with something that has not been covered here. I am trying to implement a new gallery script on my website. The script requires an <ul> of images to make it work. Example: <ul class="gallery"> <li><img src="img/architecture11.jpg" alt="architecture11" title="architecture11 Caption"></li> </ul> My question, as i have around 100 images for each album will i have to code each line manually... it would take forever! Many thanks. Maggi. Hi everyone! I am redesigning my website. It is an illustration website, and it needs to have a portfolio. I need some help with the gallery navigation. I want people to use the arrow keys to move between images, and I want the image to be in the circle. How should I do this? I don't want to use frames, and I also don't want to make an entire new page for each image. Any tips? Thank you! http://imageupload.org/?d=4DA74E611 Hi everyone, Someone suggested that I use php to create a gallery for my site. I've never used php, and I want a simple click through gallery. (in the circle.) can anyone please recommend a script? http://imageupload.org/?d=4DA74E611 This is my layout. I am attempting to set up a gallery. My goal is to have it look some what like this with the right being thumbnails and the left side a full-view, thumbs opening in the full view window when clicked. My issue is how to target the left side, I could set up frameset's but I have no experience working with them so would like to avoid if possible. What I am wondering is if there would be a way to manage it with div's and how one would go about targeting it as a display space. Thanks in advance for any advice on the matter. |
|||||||