By the time you read this I probably already tried to do this. But, is it possible to create an array with image sources? I'm thinking about doing this because it sounds a like a good plan to do since I'm trying to create a slide show. So is it possible to create array out of image sources, if no then why not?
View 9 RepliesI have 6 images (representing each side of a dice). I need to display two of these images randomly when the user clicks "Roll the Dice!". I have set up an array with all my images contained, and I have no problem getting two random images to display when the user clicks the button. This is the easy bit. Here's my code:
View 13 Replies View RelatedI prefer jQuery over flash and not sure how to tackle this, so please advise as best you can. Trying to create a site that allows for images to go full browser and then have the ability to have the other images slide in based on a click.
I also want to float a menu that will allow it to pull in other media (video, that would slide in the same way). The best example I can share is this: http://j.mp/5U79i1 What he is using is flash based (slideshowpro director and slideshow pro for flash). Not interested in flash for this personal project.
Trying to figure out OO programming for JavaScript and I'm totally lost.
Here's what I'm trying to do:
I'm posting search data to a PHP form to run a query on a database.
The structure is sort of like this:
So I'm thinking I need to create search objects or arrays. Initially, I thought I could do something like this:
Code:
This doesn't seem to work. It says object not defined whenever I try to do something.
I've also tried creating a JSON object like this:
Code:
This will allow me retrieve the data like I want to:
Code:
The problem is I can't figure out how to add data to the JSON object without manually typing it in. I need to be able to loop through form elements on my HTML page and set them to these variables. I'm using jQuery and doing something like this:
Code:
I have one web-page and one picture box in the middle of page. I have some images in my SQL database, I want to load those images on picture box placed on my web page one by one. I want to display each image for 3 seconds and then next image, but these image are not fix, I will keep changing original image files in the images directory and will specify their names in database tables. Structure of database table is as follows:
pictureID pictureNameAndPath
1 images/picture1.gif
2 images/picture2.gif
3 images/picture3.gif
I just want from system to read this tables and display these pictures in the picture box placed on the page, using Javascript.
I have an image gallery on the top-left. It is the kind where you click on a thumbnail and a larger image shows up.What would I need to do to make it so it would show a loading image WHILE the picture is loading? (Especially for my over 60% of visitors who have dial up). Right now, if I click on an image, I have to wait a little while for it to load (I DO NOT WANT THE IMAGES TO PRELOAD)
View 1 Replies View RelatedI have a javascript that loads images on the page based on the date you select from a drop down menu. So the images are displayed dynamically, however they are numbered 1 through 20.Is there a way I can add a title tag to the images that will display on mouseover?Here's the page I am working on. I want to add title tags to the six images on the right side of the page. They change based on the date selected.
View 24 Replies View Relatedi would like to create a list of all images inside a specific div. It should be outputted as ul li list. The List should be clickable and on click i would like to be send to the position of the image on my site.
View 1 Replies View RelatedI have an example of what I'm trying to do at [url]
And all the files are available in a 7-zip at[url]
Basically it only works one time when I click next, and never when I click previous.
Here's my script:
Been looking around for 3 days now, I found exactly the style that I want, have images on my web site, all I need is for someone to show, explain to me how exactly this pagination or whatever it is works, how do i select which actual images from my site or where to be shown in the main window and also the thumbnails below?
as I said, I already know what kind of slide show I want, it's in this link the lower right version of slideshow with the pics of two horses and stuff: [URL] I already have the script on my site but but can't figure out how to place my images: [URL] and I want THUMBNAILS on the bottom like in the first link.... not the text
I want to create a gallery of images with a fancybox-esque style but incorporate the "folder functionality" that this site has: [URL] In other words: When I click on an image I want it to expand to "fullscreen". (This I can manage with fancybox.) What I can't work out how to do is display more images from the same photo-session at the bottom of the fullscreen.
View 1 Replies View RelatedIs there a way to create a div or some container in which there will be an image such that the image fills the container but retains its aspect ratio? So if the container is 100px x 100px and an image is 200px x 100px it will be resized to 100px x 50px. Conversely, if the image is 100px x 200px then it resizes to 50px x 100px. An image of 400px x 50px becomes 100px x 12.5px and so forth.
The issue is I have to dynamically build the container pulling images from an image folder. The images can come in all sizes. But I want to make sure they all fit in the same square 'box' without distorting the image.
There is text and a button below the image and I want them to stay in the same 'spot' on the screen without being moved around because the height or width of the image above it grows/shrinks to accommodate a change in either the height or width. These can change but not outside a controlled 'box'.
Maybe there's a way to get the actual size (through Javascript or something) then calculate a percentage to resize the image to?
I'm trying to create a page that takes data and turns it into images - I'm starting very simply. For each row of text, I first:
if(j.match(/[a-z]+_\d+/)){
colorval='red';
} else {
colorval='blue';
}
then I add a sequence of numbers for positioning to an object called pixs (with a numerical index as well that may or may not be useful):
var xpos = startwidth+d_num;
var ypos= startheight+d_scroll;
pixs[num]= {};
pixs[num]['xpos']=xpos;
pixs[num]['ypos']=ypos;
pixs[num]['color']=colorval;
As I loop through my arrays of little pieces of data, all of this information is stocked into pixs - BUT then- I have to insert this information from pixs to a function, like:
$(container).fillRect(xpos,ypos, width, height, {color: color}) where width and height are each preset vars.
My challenges here are to 1) successfully loop through the pixs object. 2)Use jquery if possible (or if easier) to get these variable values into the function to evaluate. 3) Successfully '.fillRect' with each loop. 4) Use the append method (or something?! again, I am a n00b) to get all of these instances of fillRect onto the container in the html document (which appears to be set up and working with instances of fillRect not using variables as parameters)
i've being trying to change the src of a img tag in order to create some kind of a sequence of images.
Code:
<script type="text/javascript">
var i=0;
[code]....
I wanted to start my research on the topic of slideshows here and ask if anyone knows what's the best method for creating a slideshow that should have the ability to display images and videos (and bookmark them)? It can be a plug-in, but this is for a client so it has to be okay for commercial use (and free).It should also be able to support other content like ads and polls/questionaires, in the form of a div. Also HTML 5 compatible with all the cross-browser compatibility one would expect.
View 4 Replies View RelatedI'm not very experienced with jQuery yet and after a while of trying and searching I decided to ask for help here:
I'm using jCarousel Lite, the "Custom Widget" scenario (click in the list on the left)[url]
When clicking on a image in the carousel, the larger image is shown immedeately. I'm trying to achieve a fadeout, fadein effect. Doesn't need to be a crossfade, a fade out to white, fade in from white is fine.
My 'bare' code (this works, with instant showing of pictures, without any fades)[code]...
I'm using Jquery to create a rollover effect on 2 images (placed on top of each other) to fade the bottom image in on a mouseover and out on a mouse out. Clicking the faded in image also opens a fancybox gallery. The problem is that sometimes the animation (the fade in and out) gets stuck after closing the fancybox window and the mouseover doesn't work anymore.
Here's my code for the mouseover:
I would like to create a page that has a dropdown menu populated with a list of images. When someone selects an image, the image and a URL to a webpage will display (screenshot below). Each image will have a different URL. How do I accomplish this?
View 9 Replies View RelatedWhat I am trying to do is create a slider that auto scrolls 3-4 images from right to left with no controls. And if the user hovers over it, it stops so they can read the content that is featured. Everywhere I search there are bunch of plugins i.e. easyslider, s3slider, etc. that have tons of code that is greek to me. I tried using the easyslider code and changing things around for it to do what I want, but I was unsuccessful.
View 4 Replies View RelatedI'm trying to create a simple image gallery by loading images from an xml file The xml file looks like this
Code:
<?xml version="1.0" encoding="UTF-8"?>
<images>
<img>images/01_th.jpg</img>
[code]....
I'm trying to create a simple list of div's like below
Code:
<div>
<img = "images/01_th.jpg" />
</div>
[code]....
I have files on the server: .txt, .xml, .config, and "no extension" - all editable with notepad.
User will write some input, it will be added to file in specific place.
I need an ability to change element value in file (in one of them - depends what user choose) (or it even can be some trigger word it-self like CHANGE_ME for not to use attributes)
Create a temporary copy of edited file and create a unique temporary link to it.
I don't know what to start from.... For now I know how to make XHR, but what to do with other extensions?
Have no idea how to save the NEW file (a copy of original file) on server , and create a UNIQUE link ,and delete the file right after it was downloaded.
I can find a specific word in xml file, but how to change it?[code]...
how to change images based on action. Even clicking changed images should do respective actions. and while displaying only one image at a time sholud get displayed. I am using three images for a single column of a table in Jsp. Code:
View 3 Replies View RelatedWhat I'm looking to do is have a folder of images that I have show up on my website.I'm also looking to pull from this folder up to 6 or 7 times on the same page w/ randomized pictures that do not repeat.Finally, I'm looking to be able to size and name these images based on which image randomly pulls. b/c it's not grabbing the images.
images = new Array()
images[images.length] = 'images/example.jpg'
images[images.length] = 'images/example.jpg'[code].....
I have to do a slideshow with images of different widths... am using cycle plugin, which I like very much... I have a little test slideshow here, http:[url]....it's not centering imgs in containing div (I made div width of widest image.. this will work for my situation, in which imgs will be hard-coded..)if you inspect img element in firebug (#slideshow img), it shows that the plugin adds a style of position: absolute; top: 0px; left: 0px .to the img; why does the plugin do this.. how can I center the images in containing div...
View 1 Replies View RelatedI need to refresh multiple images on my site. So every time the page gets refreshed the images need to change. It worked fine with the script below, but this is only related to 1 image
I tried to copy the script and change the "ID's" but this does not do the job.
What should I change/add to the script below?
In head:
In body:
I am trying to make different images hover over a table of sliced images when you mouse over a particular image. ex. mouse over image 1 = have image 1.1 hover over entire table of images in spot A; mouse over image 2 = have image 2.2 hover over entire table of images in spot B....ect. what i have so far only allows me to mouse over image 1 and have image 1.1 hover over entire table in spot A. Any time i try to move forward with more div's on other images it just jacks everything up.
Here it is: <html>