an addition needed in highslide js - php

Iam using highslide js for my image blow up section and its working fine. But now i need that once an image is clicked and is blown large then if a person clicks anywhere on the page except that image then the image should get back to its original self i.e. blow up should get removed.You can check it here http://highslide.com/
Even on original url the image blow up gets closes only when a user clicks on the image again or on close buttons if any.How can i close my image blow up when a user clicks somewhere else on the page and not on image?????

got the solution.Its just that i had to use the code which is being used at cross button .

Related

FB Share pop-up different window than what is posted

I'm new to using the FB share buttons terminology so forgive me if I use the wrong syntax in describing this.
My site is setup to load pages based on the passed parameters in the URL (...?page=somepage&imageid=idnum).
So I have my index file which contains my head, as well as sidebar, etc. Then my main body is generated according to the passed parameter. Simple Enough.
On the homepage, the main body is a gallery of images. When they click on one of those images it takes them to a page that just displays that one image. The page is loaded with parameters of ?page=detail&image_id=1 /*or whatever the id of that image is */
So when they click on the share on FB button on those individual images page, I would like it to populate with the image that is displayed on that page. What I have done is included a php file in my head tag. The php script included gets the page info and passed parameters and then fills out the image url based on the imageid.
echo '<meta property="og:image" content="http://www.chiseledimages.com/clients/vote/'.$imgurl.'"/>';
This works in that when displaying the page source, the meta tag with og:image shows perfectly, also in that when I run it through the FB Object debugger, it gets the correct image and doesn't show me any errors. It even posts the correct image when the users shares on their wall. What is does not do, is show the correct image in the pop window after the uses presses the share button on my site. So even though the result is what I want, the problem with the user not seeing the correct image in the share pop-up, may lead them not to want to share on their wall.
Current location of site: http://www.chiseledimages.com/clients/vote/
Example of a specific pages: http://chiseledimages.com/clients/vote/?page=detail&angel_id=1
Screenshots of pop-up with wrong image, but final posted story having correct image.
How can I make the image in the pop-up match the image that is going to be shared. Thanks.
Edit: I forgot to mention and I'm sure it matters that I'm using Addthis to implement the FB share.
Check https://developers.facebook.com/docs/reference/dialogs/feed/ - look for the 'picture' parameter description
I suggest to you use this http://support.addthis.com/customer/portal/articles/1365475-attribute-based-configuration#.UwPQB6LW6So. just follow their example and you good to go.

How to make an image selector to choose an image from the server to use in HTML form

I have built a blog system where each entry has an associated image file. I have created a php upload for this system and can get everything onto the server. When I write each blog post I have a row in my database which stores the filename of the image, so I could, if I knew the filename already, just type it in.
What I want to do is on my blog post form, instead of being able to type the file name, I want a button to click on which opens a window with all my images in it, then I can click on one and have that filename sent back to the form.
I suppose I could use AJAX to do this but it seems over complicated. Does anyone know of a good way to achieve this.

jquery preview modified image in dialog

I have a form with 2 file input which the user will select images to upload.
On submit when the images are uploaded, I first resize the image and merge it with another image using gd and this works fine.
What I want to do before the form is submitted, using Ajax on change of the file input, get the image, processes it on the server using gd (but not upload) and show the user the final result in a ui dialog for them to approve or not.
For reasons beyond my control I cannot use html5. I know you can't post files using Ajax and need to use jquery-iframe-transport or jquery-file-upload or some other plug-in like that.
What is recommended and how do I return the final image to display in the dialog, and if the user then click disapprove, how do I clear the file input field?
Thanks
Take a look at this: http://www.9lessons.info/2011/08/ajax-image-upload-without-refreshing.html
The above tutorial will show you how to do image upload using JQuery.
You can easily change the php file that handles the upload, show the image to the user, if they clicked disapprove, then simply remove the file from the server and start over.

How to send an image from one page to another page using PHP

I have a project am working on,, its about (Graphical Password) it's an authentication security system (Web Based), which ask the user to register by entering his information such as (first name.. last name.. etc ) and with these information there will be a group of images with each image has a number written below it ,, so the user will enter his info like usually and will be an extra field for (image number) the user write the number of the image that he want ,,(the images will be previewed as thumbnails in the page). at the end he click submit, the information it will be stored in database using (PHPMyAdmin),in the database there will be columns for each data plus a column for image number, it will be storing the image number ONLY not the images, the images stored in a folder with its names from (1-20), till here no problem..
The Problem is : When the user click submit it should open another page and it should display the image that he chosen before from the previews page with big size image so later i can do some processing on the image..
My Question is : How to send that image to another page by using PHP language..
Am using DreamWeaver CS6, here is a photo of the site http://www.4shared.com/photo/YcBeAhsz/Capture.html?
and the code is here : http://www.4shared.com/file/unOI9Ejs/registeration_page.html?
I hope my question is clear and i wish i can get some answers.. thanks in advance..
This is a little tricky without know the code your using.
You can store the images you get to the web server by:
file_put_contents('image1.gif',file_get_contents('http://static.php.net/www.php.net/images/php.gif'));
The on the next page display the image back.
<?php
$user_picked_img_id = 1;
?>
<img src="image<?php echo $user_picked_img_id ?>.gif"/>
Let me know if that fits what you are trying to do.

refresh page when image content changes but image name doesn't ,php

I have an upload picture form. When the user changes the picture I overwrite the picture he already has.The picture always bears the user's name.
I use CodeIgniter, the settings are:
$config['overwrite']=TRUE;
$config['file_name']=$this->session->userdata('username');
After he uploads the picture I reload the whole page
$this->load->view('bilet/uploadform');
I have to refresh the page in order for the new pic to appear, why is this ?
Why doesn't it work the way I expect it to? (I am not using AJAX yet,I will soon)
if you save the new uploaded image name as the old one this is a caching issue , thats why you have to refresh , you can add a random generated number to the image name or in the src attribute add a random number like this for example :
http://www.mywebsite.com/image.png?number=123123
or
http://www.mywebsite.com/image.png?number=6546587
somthing like this will prevent called cached images .
hope this will help .
yeah, its common, you have to refresh the page if you are not using some ajax magic.
To do the refresh in the CI way .
Load the URL helper .
And then
redirect('/path/to/controller', 'refresh');

Categories