JQuery :: Images Appear Shrunk Down Like Thumbnails Instead Of Full Size
Mar 29, 2009
I have a couple of image slideshows on my site and in IE occasionally the images appear shrunk down like thumbnails instead of full size. why that might happen and what i could do to stop it? [URL]
I 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.
I have some jQuery that inserts rows in a table, and currently just set the font colour of the new row to a highlighted colour for a second or so, to show the added row.I would really like to be able to make the new row grow from zero height to its normal height, rather than just appear, as this woudl look nicer. Similarly, when I delete a row, instead of fading to zero opacity, then being removed abruptly (which causes the rows below to jump up),I tried this using show() and hide(), which I thought would do it, but they don't. They fade the opacity correctly, but change the height in one jump.
I so far have a scrollable image gallery of some thumbnails, I now wish to be able to click on the thumbnails and it load the corresponding full sized image with the website and everything else behind it being darkened/dimmed.the xhtml is structured like this so far, with no links to the full size images
I am looking for a plugin that will popup a full size image WITH HYPERLINK when user clicks the thumbnail image link. I found [url] is useful but I can't add the hyperlink to the full size popup image.
Iīve just launch my website-portfolio, well itīs not yet the final version but it is almost and despite I am satisfied with the final result Iīve detected a really strange bug that only happens sometimes. The thing is when the first introduction Slide appears (the one with the hand-made drawings), sometimes the images shrink from the normal size to small tiny images. This doesnīt happen always and if you refresh the page it disappears.
Follow the link to the page were the bug happens - [url]. I'm using jquery cycle plugin, check it out.
I'd like to implement something like what's found on [url] game description pages (when you click on a screenshot's thumbnail you zoom to the full-size screenshot). I'm currently in the process of stripping down their code to the bare minimum so I could try to understand how this can be done and then make my own. But this could potentially take a lot more time than needed. Are there any tutorials that I could read on this, instead?
I have a series of 30 thumbnails. When a user clicks on the thumbnail I would like to add the enlarged photo to to the "bigSample" div. Because the photos file sizes are large, I think it would be best to add them on the fly using addChild. I will be using an external script with initAll and I think I might be able to use this.parent.href, but my Javascript skills have only improved slightly. It would also be nice to toggle them so that if they clicked the thumbnail again the enlarged photo would go away, but maybe that's too greedy a request.
I am to create 4 links on a html page that when the link is clicked it brings an image up in a certain position. When you click the second link it is to bring that image up in the same position as the first image and so on and so on. I can get the links to work but the image is full size and it is not in the position that I was expecting it to be in. Once the image is displayed it covers the links so they are not able to be used. I put all the code on one page just for testing purposes, I figred that if I could get it to work in one page splitting the code into a css page and a js page would be the easy part. I have rewritten the code with buttons instead of links and I get the same result.I think there is a problem with the css but I am not sure.
I am trying to make a site for a photgrapher where the user see's thumbnails of his pictures, then when the pictures are clicked on I want them to open up in a dynamic content box.I can only assume that this is JS/AJAX coding that does this.I have found the following bit of code that does almost this. Except it performs the function on page load and not on mouse click and it opens one of two pages randomly.
var interstitialBox={ //1) list of files on server to randomly pick from and display displayfiles: ['samplecontent.htm', 'samplecontent2.htm'],[code]...
from what I can tell, each thumbnail would need their own bit of code that calls on a function related to the full size image url.
Recently I've been using a .slideToggle script to show big images when thumbnails are clicked.
However, the <div> that is revealed does not Toggle Up when multiple thumbs are clicked, so I'm left with a bunch of open <div>s on the page.
I'm not sure what to do -- I think it has something to do with the siblings of the class "largeexamples" but I'm not sure. I've also been reading about eq, but I'm not there yet.
What 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.
I need to display a set of images. NOT a slideshow that automatically changes, but a very simple display, one image at a time, that moves to next or previous by mouse click or arrow.
I can retrieve the set of filespecs in php with no problem. And I've got the setup in php to display the file, one at a time.
I"ve figured out how to open a full-screen window in javascript.
What I need (I started in php and they sent me over here for specific javascript info), is to put everything together...
1. I'd LIKE to automatically set the resolution on the system to 1024x768. I've been told html and javascript can't do that, so it'll have to be done by the user.
2. I figured out how to open a full-screen window in javascript.
3. What I need is to display the image from php and have it show up in the full-screen window I created. Then it just sits there until the user presses an arrow key (or hopefully something with the mouse) to go to the next (or previous) image. Back to php for the next file and display...
Once the last image in the set is displayed I'd like to have the window I created go away, sending me back to the screen from which all that got started...
So, as far as I know, the two things I need to know are how to display an image in a particular window from php. And, how to get mouse-clicks and/or arrow keys back to php so I can use them....
i have i am using a jquery.lightbox-0.5.css does anyone knows how can i specify so that when the lightbox pops up keeps the all the images or at least the lightbox of the image on the same size because when it pops ups dpending on the image some of them are huge they just ocupied the whole screen??
I have been trying for ages to find a way of making a series of images within one div resize according to the size of the users window or their screen resolution.
how i can do this? i know jquery uses the .resize function and am hoping i could give the div with images inside a function to change size according to the window size.
Quite often, some images are displayed with much smaller sizes than what they should be. For example, an image with height 768px may be displayed with a height of about 100px. This problem is usually sovled by refreshing the page. The page may need to be refreshed more than once to get all the images to their correct sizes.
I need to get the size of images that I 'm preloading to make a javascript photo scroller. IE gets the correct sizes but Mozilla/firefox/Opera always get 24px when loaded for the first time. Whenever I click on refresh it works it is just the first time.
One thing I have noticed if that if I add an "alert ('whatever');" after preloading each image it does work. Any clue what could be wrong? why adding an allert makes it work?
Remember it does not work when loading the page the first time so you need to close down the browser and reopen it. Code:
I have been trying all sorts of things, but falling short... I'm trying to set up a way to detect a user's browser size and then call a specific background image accordingly...
say (for example) that BKGD1.jpg is for users who have browsers that are 1280x1024 and higher; BKGD2.jpg is for users who have browsers that are smaller than 1280x1024...
i'm even open to an option that only displays a background image if the browser is (as in the example above) 1280x1024, and just a background color if the browser is smaller than that.
I am new to Jquery mobile framework.I have an asp.net web application and I want to convert it into Jquery mobile framework.I have a datalist on an aspx page.The size of the datalist decreases according to the window size to certain extent after which the size of the datalist becomes constant and doesn't decrease with the window size.
I was viisitingand saw the images fade on the home page. It uses jquery and I was needing some assistance getting this working on my web site. Where would I locate any "how to" documentation?
im a totally beginner so this may be obvious but im stuck I have image galleries on my site and i want the images to fade in after loading, at the moment i have the following script:
I'm using the cycle plugin to create a slideshow of highlights. So far I have the slides automatically fading between each other but I'd also like to have thumbnails that when hovered jumps the slideshow to the associated slide. Using pager and pagerEvent I can do this but I don't know how to use my own thumbnails for the pager.
Does anybody know of any simple, stable plugin that does that ? been looking around and most of them bring slideshows, carousels, etc All i want is to put them into a static grid but not having to resize manually every pic that is uploaded.
I have a grid of thumbnail divs, 3 columns wide, which alternate having the class .first, .second, .third, repeating for each row. The divs also have a class according to the category to which they are assigned. There is a menu which allows you to filter the thumbnails by category. So, when you choose a category, it hides any div that doesn't have a class with that category. What I need to do is, when the grid is filtered, somehow clear all the .first, .second, .third classes, and reassign them based on the items that remain visible.
I came across this awesome image slider: Thumbnails Navigation Gallery with jQuery. The problem is ..you have to click on "best shots" to see the thumbnail navigation... 1) How do you show this thumbnail navigation straight away on loading the page? (ie "best shots" and other list items dont need to be there) 2) and get the thumbnails show near the bottom of the page? 3) and also get the next image to fade in automatically say after 5 seconds, without having to click on a thumbnail, although one can?