chiprivers

I am just starting to get my head around using GD (I have found a really good tutorial for beginners here http://www.nyphp.org/content/presentations/GDintro/gd1.php. The end result I am looking for will be an image depicting a stack of polaroid photos with a string of text written on the tab of the top polaroid. I am now ok (I think!?) with taking a given image and resixing it, rotating and positioning it onto a background image holding the stack of photos. What I need to do now is generate the text to write on the bottom of the polaroid tab. From the tutorial I have been using I am assuming that I can only add text using a limited selection of fonts which don't suit my requirements. Can somebody help me with a solution to this? I need to be able to either write using a different font or create another image on the fly with the writing to merge with the project image.

The final effect I would like to create is an image of pile of polaroid photographs. I want to create this from a standard backdrop image that will depict the pile of photographs with a blank black area where the photo would be. I would like to take a submitted photograph that will be prepared at the size of the area to fill. Using GD or similar, can I then offset the photograph by a number of degrees to align with the backdrop and then superimpose it onto the backdrop to produce a final image?

bump

What is error?

OK guys, I'm really struggling with this! I am not picking up AJAX quick enought to be able to create a request from my database and I can't find a javascript example that I can adapt to my requirements. If I give you what I have to work with, could somebody tell me what I need to do? I have the following two tables in myMySQL database: CREATE TABLE parish_groups ( groupID int unsigned not null auto_increment primary key, group varchar(50) ) CREATE TABLE parishs ( parishID int unsigned not null auto_increment primary key, groupREF int, parish varchar(50) ) In my form I have two drop down boxes: <form id="parish_select" name="parish_select" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post"> <select id="parish_group" name="parish_group"> <!-- options here populated by entries in table parish_groups --> </select> <select id="parish" name="parish"> <!-- options here to be populated by entries in table parishs dependent on selection in first selct box --> </select> </form> And so as the notes say, I will query the database table 'parish_groups' to populate the first select box using the 'groupID' as the value and the 'group' as the display text. On selection of an option in the first select box, I would like the second select box to populate with entries from the 'parishes' tables where 'groupREF' equals the value of the selected option in the first select box. I have tried to get my head around doing this using on of two ways, either: #1 creating a multidimensional array within the page containing all of the entries from the 'parishes' table and then using javascript to populate the second select box from this array. or #2 using AJAX to query the database and return the requrie entries So far I have been unable to keep up with the examples inorder to be able to apply my own script and table to it. Can anybody please help me?

I want to be able to create a form containing two drop down select boxes where the options in the second dropdown are dependent on the selection made in the first drop down. I can see that this is quite a common query but I want to be able to do this without reloading the page or using AJAX or similar. I understand that this should be possible by loading all the required options into a set of arrays or one multidimensional array and populate the second dropdown using javascript. I have googled and googled but keep coming up with methods that are not suitable, please could somebody walk me through the basics or direct me to a tutorial that will show mehow to do this using purely javascript?

I think this is probably the best and easiest way for me to proceed as the amount of data is not huge. Also as I have not used AJAX and the other suggestion still involves submitting the form. Can anybody help me out with a tutorial for this option?

I would like to have two select boxes in my form, the options in the second one dependent on the selection made in the first box. However I do not want to have to reload the page to populate the options of the second select. Any ideas?

Is there a simple function that I can use to force 0's (zeros) infront of a given number so that it will always be a fixed number of digits long. ie. If I want to always display a number as 5 digits and I am given the number 50, I want to force it to display as 00050.

This shows how to implement a basic shortcut command but can I use the F.. (function) keys?

I would be liek to be able to set up a webpage with shortcut keys so that when certain buttons are presses, a pop up window will open with a designated further page displayed. Specifically I would like the shortcut keys to be a couple of the function keys, ie f10, f11 and f12.

Bearing in mind I don't have any knowledge or experience with GD, please could somebody give me a simple walkthrough on how to dynamically apply some watermark text to the photos displayed on my site.

I want to give my photos a frame like this one http://www.nittygrittygame.co.uk/photos/thumbframepng.png This is an image I have drawn and tried to use as a backgrond image behind my photos. This worked in IE but had trouble with firefox. Is there a better way to create this effect? possibly by breaking the image into smaller chunks and using CSS to get them to display in the right places or by creating additional table cells around the image cell to hold the smaller bits? I am looking for the best way to create this image whilst keeping it displaying the same in both IE and Firefox.

I would like to build a very simple photo gallery script but in a way that I have not used before. I would usually have approached this using a database but to keep it much more simple I just want my script to pick up what ever is in a given folder. So what I want is a parent folder that holds my photo albums, we'll call this folder 'albums'. In this folder will be other folders, one for each photo album. I want my first page script to simplt look inside folder 'albums' and return a list of the folders found. I can then on this first page display an index of folders. My second page will be the gallery script that should then look inside the sellected album folder (from inside the 'albums' folder) and return a list of the files inside it. I can then use this to display my gallery of thumbs. I am sure this is a very simple process and already in use on many gallery sites. I am just not sure on how you do the it on looking into the folder and returning the contents?

Me again guys! The following HTML and CSS files are used to structure and style my sites header and nav bar. I can't for the life of me work out to vertically position the nav link text within the nav bar. I have tried applying padding and margins to both the '#nav a' and the '#nav' but nothing is working!! <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Template Script</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <div id="header"> <img id="hdr_logo" src="images/hdr_logo.jpg" alt="site logo" title="site logo"> </div> <div id="nav"> <a href="#">nav bar link</a> <a href="#">nav bar link</a> <a href="#">nav bar link</a> </div> </body> </html> body {width: 95%; font-family: verdana; font-size: 62.5%; text-align: center; padding: 0 0 0 0; margin: 0 auto 0 auto} /* header display */ /* ============================================ */ #header {width: 100%; height: 78px; padding: 10px 10px 10px 10px; margin: 0 0 0 0} #hdr_logo {float: left; margin: 20px 15px 5px 5px} /* nav bar display */ /* ============================================ */ #nav {width: 100%; height: 28px; background-color: #009999;background-image: url(images/navbg.gif); background-repeat: repeat-x; background-position: 0px 0px; text-align: left; padding: 0 0 0 0; margin: 0 0 0 0} #nav a {font-family: rockwell, verdana; font-size: 1.4em; font-weight: normal; color: #FFFFFF; text-decoration: none; margin: 10px 1.5em 0.5em 1.5em} #nav a:hover {color: #6A2C6F}

My error! should be background-position not repeat-position!! My questions still stands however about whether I should be declaring a doc type for my CSS?

OK, so I have started over with my coding and attempting to write valid code. I should point out that I have never declared a doc type or validated before so this is all new to me. I am completely self taught with HTML, PHP, CSS etc and I am sure I am going to have to re-educate myself to make sure I am writing valid code. I am starting of just trying to build a uniform header for my site pages to display a logo and nav bar. I have entered my initial layout script as below: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Template Script</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <div id="header"> <img id="hdr_logo" src="images/hdr_logo.jpg" alt="site logo" title="site logo"> </div> <div id="nav"> </div> </body> </html> I have entered this through the validator as mentioned before and this has all come back fine ;0) Attached to this I have the following CSS file: body {width: 95%; font-family: verdana; font-size: 62.5%; text-align: center; padding: 0 0 0 0; margin: 0 auto 0 auto} /* header display */ /* ============================================ */ #header {width: 100%; height: 78px; padding: 10px 10px 10px 10px; margin: 0 0 0 0} #hdr_logo {float: left; margin: 20px 15px 15px 15px} /* nav bar display */ /* ============================================ */ #nav {width: 100%; height: 28px; background-color: #009999;background-image: url(images/navbg.gif); background-repeat: repeat-x; repeat-position: 0px 0px} this however is not validating and highlighting: 11 #nav Property repeat-position doesn't exist : 0 0 First question for my CSS is should I be declaring any version of CSS as I have done in my HTML? Secondly, how can I make this repeat position declaration valid? I have checked the CSS reference and it seems to be OK!?

It is displaying a border arounf the photo but without the 1px clearance!

This works fine in firefox but not in IE, if I use this new approach, how can I get it to work in IE?

I am working on quite a big project at the present and as non IE users make up quite a large proportion of surfers these days, I am for the first time trying to make my site cross browser compatible. I am specifically looking at making my site work in both IE and Firefox. The issue I have at present is the simple task of applying a frame to a photo image. Very easy CSS in IE, I am sitting any image inside a <div> with a class="img_frame" where .img_frame{width: 1px; height:1px; padding: 1px 1px 1px 1px; border: 1px solid #99999}. Now in IE this works lovely and puts a nice grey line around the image with a 1 pixel gap. IE allow the div size to expand to allow for the size of the image placed inside of it. How ever, in Firefox, the div remains at 1px square size. If I leave out the width and height size the div becomes too wide? Any suggestions to make my current approach work or an alternative approach to applying this border that would work in both browsers?

Is it possible to create a basic shadow effect on photos using purely CSS and HTML without the need to have any images to represent the shadow fade?

I think I can do it using CSS?! possibly have the larger versions of the images scripted into the page already and position them using CSS in the correct position but somehow make them invisible other than when the mouse is over the correct thumbnail. ANybody have any idea what I'm talking about and exactly how to doit?

In the past I have used this basic javascript to do an image change on mouseover, but I need to do here is have the larger image float over the top of the page without effecting the rest of the display. If I change the thumb image to the bigger image the rest of the display is going to distort.

Could somebody help me with how to display a larger version of an image when the mouse hovers over the thumbnail? I have an index page displaying some thumbnail images. I have a slightly larger version of the image saved which I would like to be displayed momentarily as the mouse hovers over the thumb.

Thanks pocobueno1388, that was just what I was looking for. I'm fine with the pagination (I think), but just wasn't sure of best way to sort out the dynamic display in columns.