Image gallery with CSS menu

I have a image gallery (slideshow) created with Flash and
XML. My website uses a css/javasript dropdown menu for navigation.
The dropdown menu is hiding behind the slideshow no matter what I
set it's z-index to. Is there something in flash that lets me set
its z-index? I could jsut drop the menu off of the page and give a
return link but that is a workaround and I would much rather stay
consistent with my site. Any help that could be given would be
appreciated.
Mark V.

"mvanneman" <[email protected]> a écrit
dans le message de news:
f9ssu4$346$[email protected]..
>I have a image gallery (slideshow) created with Flash and
XML. My website
>uses
> a css/javasript dropdown menu for navigation. The
dropdown menu is hiding
> behind the slideshow no matter what I set it's z-index
to. Is there
> something
> in flash that lets me set its z-index? I could jsut drop
the menu off of
> the
> page and give a return link but that is a workaround and
I would much
> rather
> stay consistent with my site. Any help that could be
given would be
> appreciated.
try to embed your movie with wmode="transparent"
lea

Similar Messages

Spry image gallery with filmstrip - how to display all thumbnails?

Hello,
I'm using the Spry image gallery with filmstrip and want to be able to show all thumbnails. So instead of scrolling across to see all the thumbnails I would like to display them in a couple of rows. I thought it would be a case of changing the css from overflow: hidden to overflow: visible and increasing the height but this didn't make a difference.
An example of my gallery is here http://www.demo.femmewebsites.com/gallery.html (This site doesn't have many thumbnails but I have others with 20+ images that need to be displayed)
Your help would be much appreciated.
Thanks

Hello Krista,
did you have a look here: http://labs.adobe.com/technologies/spry/demos/pe_gallery.html, where you will find DW "Photo Gallery Demos". In every demo, are arranged a large number of images in several rows and rows. Therefrom you can use their source codes.
Hans-Günter

Is there a way to create a CSS image gallery with caption?

Hi everyone,
Ive been using the disjoint rollover, but I only have one
thing that I want to add to it—a caption right underneath an
image.
Besides using that Project Seven plug-in, is there a way to
create an image gallery without using layers? Or is layers the only
way to do it? All I want (words of doom, huh?) is a thumbnail to be
able to switch and image and add a caption to it. Can anyone point
me in the right direction? Or is that Project Seven plug-in deal my
best bet? What about Set Text of Layer in DW.
Oh yeah, Im still using DW with CSS sprinkled in..any help?
Thanks in advance.
-C

> Besides using that Project Seven plug-in, is there a way
to create an
> image
> gallery without using layers?
Of course.
> What about Set Text of Layer in DW.
That would do it, and it's not necessary that the layer stay
a layer after
you have done it, either. I do this frequently - make a
layer, apply the
behavior, and then remove the position:absolute from the div,
and place it
where I want it.
See the demo here -
http://dreamweaverresources.com/tutorials/settextoflayer.htm
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"psypent81" <[email protected]> wrote in
message
news:eus555$lac$[email protected]..
> Hi everyone,
>
> Ive been using the disjoint rollover, but I only have
one thing that I
> want to
> add to it?a caption right underneath an image.
> Besides using that Project Seven plug-in, is there a way
to create an
> image
> gallery without using layers? Or is layers the only way
to do it? All I
> want
> (words of doom, huh?) is a thumbnail to be able to
switch and image and
> add a
> caption to it. Can anyone point me in the right
direction? Or is that
> Project
> Seven plug-in deal my best bet? What about Set Text of
Layer in DW.
>
> Oh yeah, Im still using DW with CSS sprinkled in..any
help?
>
> Thanks in advance.
>
> -C
>

How can I create an image gallery with "next" buttons?

So I am almost done with my portfolio site (YES!)..now I just need the actual content (the images). My site is written in AS3.
I've watched many tutorials on how to create an image gallery (auto scrolling ones, scrolling ones that require mouse hover, etc etc), but those aren't what I am looking for.
I want a gallery that looks exactly like this one here:
http://jalbum.net/res/help/integrating-tutorial.html
I have a lot of work to display in my porfolio so there must be arrows at the end of the thumbnails so I can add more stuff. So I am just stumped on how to make the image gallery work with the ability to scroll for more photos with the click of the arrows.
Any ideas? Thank you.

Watching tutorials and learning from them are two different things. If you have learned from them you should be able to use what you have learned to devise a gallery such as the one you link to. If you have learned from them and cannot use what you learned, then you probably need to find/learn more.
If you study the design you linked you should be able to reason out what elements you need to devise... it is not overly complicated.
For the large picture you could have a Loader into which you load whatever image is selected from the thumnails. To get a brief transition you could just set the alpha of the Loader to 0 when an image change is occuring and gradually fade it in after the image has loaded.
The greatest challenge you are likely to face is in getting the thumbnails to advance back and forth depending on which is selected. All of the thumbs would be placed in a container (movieclip or sprite) and that would be masked so that only a portion of them is visible.
All thumbs that are not selected have their alpha property set to some value less than 1. Selecting one calls for the file it associates with to be loaded into the Loader. If the choice happens to lie off screen, then you need to move the movieclip that contains all of the thumbs some set value in the right (+x) or left (-x) direction.
If you want the thumbnails to wrap infinitely then when one leave the thumbnails area for movement in a direction, you need to take that thumb and relocate it to the other end of the thumbs in the container.

I want to create an image gallery with forward back nav, master image with a click to pop out zoom

Hi Musers,
I'm currently building a photography website and need some help building a specific type of gallery.
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
Below is a description of the gallery I want to build:
On the gallery page the gallery appears as a single 'Master Image' with forward and back 'Navs.' and a 'Counter' underneath this single 'Master Image'. Lets say that there are 10 images in this gallery. When the viewer clicks on the forward 'Nav.' the 'Master Image' changes to the next image in the sequence of 10 and the 'Counter' below confirms this progression, in this example the 'Counter' changes from 1 of 10 to read 2 of 10, the 'Master Image' displayed is the second image in the sequence.
Simple so far.. This above I can do as this is just a basic gallery. What follows is what I cannot find a solution for.
I want the gallery viewer to be able to click on the 'Master Image' and launch an enlargement of that image overlaying the gallery page, very much like the way the 'Lightbox' widget displays an enlarged image. When the viewer clicks off the 'Ligtbox' or enlarged image it dissapears, reverting the page view back to the standard gallery view with 'Master Image', 'Navs.' and 'Counter'. I do not want the expanded / Enlarged 'Lightbox' image accompanied by a thumbnail gallery, 'Navs.' / Navigation arrows or a 'Counter'. What I want is to be able to launch an enlarged version of the 'Master Image' as an overlay on the gallery page, something like a pop out.
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
Can anyone explain how I can do this? Is it possible?
The solution I want seems to be a highbrid between the standard gallery with navigation arrows kept but minus thumbnails and captions with some of the functionality of the lightbox gallery widget.
I very much appreciate any help anyone can give.
Thank you

Hi Harriet,
Thanks for the message. I'm sure as time goes on new features will be introduced but it's a bit of a shame that the widget library is a little basic, oh, and at times it's just that little bit buggy. So far I'm really impressed by Muse despite being ever so slightly disappointed by some of it's limitations. I'd like to see more image gallery options, the ability to set up a client login area or a client ftp within a site, I also tried embedding video but as I'm no programmer the result looked clumsy so some focus on this would be a help. Considering that a good number of people benefiting from a Muse site will be online retailers a zoom function should have been there from the start.
Best regards
Jacques

Image Gallery with cfdirectory with no DB

Hi
Im trying to get an image Gallery going with cfdirectory with
no Database amd pagination through Cfdirectory
Im current using cfdirectory to create a query and
cfx_openimage to create thumbnails.
the issue I have and where Ive been stuck is when a user
clicks on a thumbnail, how do i get pagination going the next page
between the photos
here is my code
<cfdirectory
directory="#GetDirectoryFromPath(GetTemplatePath())#/#url.username#/images/#url.date#/"
name="dirQuery"
filter="*.jpg. *.jpeg"
sort="name ASC, size DESC">

<cfquery dbtype="query" name="GetBoth">
SELECT * FROM dirQuery
</cfquery>
<cfoutput>
<cfloop query="GetBoth">
<a
href="/outandabout/#url.username#/images/#url.date#/#getboth.name#"><img
src="/outandabout/#url.username#/images/#url.date#/thumbs/_#getboth.name#"></a><br>
</cfloop>
</cfoutput>
Thanking you advance

Your code links directly to the image not a page displaying
the image. If
you are wanting pagination you will need to use page to
display the full
size image and the paging links.
Bryan Ashcraft (remove brain to reply)
Web Application Developer
Wright Medical Technology, Inc.
Macromedia Certified Dreamweaver Developer
Adobe Community Expert (DW) ::
http://www.adobe.com/communities/experts/
"stevegio" <[email protected]> wrote in
message
news:f58unu$j5$[email protected]..
> Hi
> Im trying to get an image Gallery going with cfdirectory
with no Database
> amd
> pagination through Cfdirectory
>
> Im current using cfdirectory to create a query and
cfx_openimage to
> create
> thumbnails.
>
> the issue I have and where Ive been stuck is when a user
clicks on a
> thumbnail, how do i get pagination going the next page
between the photos
>
> here is my code
>
>
> <cfdirectory
>
>
directory="#GetDirectoryFromPath(GetTemplatePath())#/#url.username#/images/#url.
> date#/"
> name="dirQuery"
> filter="*.jpg. *.jpeg"
> sort="name ASC, size DESC">
>
> 
> <cfquery dbtype="query" name="GetBoth">
> SELECT * FROM dirQuery
> </cfquery>
>
> <cfoutput>
>
> <cfloop query="GetBoth">
>
> <a
>
href="/outandabout/#url.username#/images/#url.date#/#getboth.name#"><img
>
src="/outandabout/#url.username#/images/#url.date#/thumbs/_#getboth.name#"></a><
> br>
> </cfloop>
>
> </cfoutput>
>
>
> Thanking you advance
>
>
>
>

Need work around for image gallery with password protected URLs

Is there a way to display an image gallery that has password protected URLs?
I can build the image gallery in Siena using an excel table with a list of the images and when I preview the app inside Siena I get the expected credentials prompt from IE, and I enter the credentials and the images load and display with their captions perfectly.
There are 4-6 images in the gallery.
When I publish and produce a store app, the app errors out with can’t connect and obviously fails on
var GenericInitError = "The app could not connect to the server. Please try again later.",
GenericInitTitle = "Network error";
Most likely because Siena wants to preload everything and there is no way with preload to enter credentials.
I am looking for any alternatives that would let me get around this.
TIA
-- Barb Bowman

On Mon, 24 Mar 2014 05:10:01 +0000, Radu Gruian (MSFT) wrote:
>One possible thing to do would be download and embed the images into your app, eliminating the need for password-based authentication.
Nope. The app accesses a group of IP Security cameras. Static images would not
make any sense. And authentication is required. Not negotiable.
-- Barb Bowman

Image Gallery with Paged View

Hello
I'm developing an application with an ASP backend, to allow
users to input photos and have them immediately display in a
gallery. It all works fine except I can't figure out how to make
the slide show loop only within the current page.
There's an example
test
gallery here in which I've turned off autoslideshow on load -
but if you click the 'Play' button, it traverses the entire
dataset.
Any advice or thoughts would be appreciated.

Your code links directly to the image not a page displaying
the image. If
you are wanting pagination you will need to use page to
display the full
size image and the paging links.
Bryan Ashcraft (remove brain to reply)
Web Application Developer
Wright Medical Technology, Inc.
Macromedia Certified Dreamweaver Developer
Adobe Community Expert (DW) ::
http://www.adobe.com/communities/experts/
"stevegio" <[email protected]> wrote in
message
news:f58unu$j5$[email protected]..
> Hi
> Im trying to get an image Gallery going with cfdirectory
with no Database
> amd
> pagination through Cfdirectory
>
> Im current using cfdirectory to create a query and
cfx_openimage to
> create
> thumbnails.
>
> the issue I have and where Ive been stuck is when a user
clicks on a
> thumbnail, how do i get pagination going the next page
between the photos
>
> here is my code
>
>
> <cfdirectory
>
>
directory="#GetDirectoryFromPath(GetTemplatePath())#/#url.username#/images/#url.
> date#/"
> name="dirQuery"
> filter="*.jpg. *.jpeg"
> sort="name ASC, size DESC">
>
> 
> <cfquery dbtype="query" name="GetBoth">
> SELECT * FROM dirQuery
> </cfquery>
>
> <cfoutput>
>
> <cfloop query="GetBoth">
>
> <a
>
href="/outandabout/#url.username#/images/#url.date#/#getboth.name#"><img
>
src="/outandabout/#url.username#/images/#url.date#/thumbs/_#getboth.name#"></a><
> br>
> </cfloop>
>
> </cfoutput>
>
>
> Thanking you advance
>
>
>
>

Create a full-screen image gallery with MSO - breaks other buttons?

Hi - I'm trying to create a full screen image gallery to be accessible from any layout via a button. The ultimate goal is to use my layout as a presentation tool and allow the presenter to have an 'image gallery' button on each page,so they would be able to jump to a full screen image at any time. Most of my layouts have other buttons, scrollable content, etc. I thought I had a great idea: create a multi-state object with the first state being blank, and each subsequent state would have an image and also a full screen black box at 50% transparency. The problem is, now my other buttons are no longer working. I confirmed that the existing buttons will work if they are arranged to be in front of the image gallery MSO, but that's not a good solution. Am I missing something or is there another workaround? Thanks!
John

You have to put buttons inside each state of the MSO.
It's not really a workable design in the long run, you should probably rethink it It's also not good from an app performance standpoint as it requires loading full-screen images for each state into memory.
Neil

Help needed with CSS menu please

Hello
Could someone give me a hand with a CSS menu I am struggling
with please?
I want each of the blue menus to have a black border around
it (so 4 borders in total). And how do I make each menu have a
closer gap? I need them squashed up a little bit more vertically.
The code is as follows -
<style type="text/css">
#ddblueblockmenu{
width: 179px;
border-top: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
border-bottom: 0 solid #FFFFFF;
border-left: 1px solid #FFFFFF;
#ddblueblockmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
font: normal 75% 'Trebuchet MS', 'Lucida Grande', Arial,
sans-serif;
border: #000000;
#ddblueblockmenu li a{
display: block;
padding: 5px 0;
padding-left: 9px;
width: 169px; /*185px minus all left/right paddings and
margins*/
text-decoration: none;
color: white;
background-color: #2175bc;
border-bottom: 11px solid #FFFFFF; /*change border gap size
here*/
/*border-left: 1px solid #1958b7;
* html #ddblueblockmenu li a{ /*IE only */
width: 187px; /*IE 5*/
w\idth: 169px; /*185px minus all left/right paddings and
margins*/
#ddblueblockmenu li a:hover {
background-color: #2586d7;
border-left-color: #1c64d1;
#ddblueblockmenu div.menutitle{
color: white;
border-bottom: 1px solid black;
padding: 1px 0;
padding-left: 5px;
background-color: #FFFFFF;
font: bold 60% 'Trebuchet MS', 'Lucida Grande', Arial,
sans-serif;
</style>
<body>
<div id="ddblueblockmenu">
<ul>
<li><a href="whoarewe.htm"><strong>What We
Offer</strong></a></li>
<li><a
href="guidelines.htm"><strong>Professional
Guidelines</strong></a></li>
<li><a
href="workshops.htm"><strong>Workshops</strong></a></li>
<li><a href="contactus.htm"
style="border-bottom-color: white; font-weight:
bold;">Contact</a></li>
</ul>
</div>
</body>
</html>
Any help is very greatfull appreciated!!
Tom

"Gary White" <[email protected]> wrote in message
news:[email protected]..
> On Tue, 23 May 2006 11:42:13 +1000, ".: Nadia :. ACE :."
> <[email protected]> wrote:
>
>>If you want a border the same color around the whole
menu, you can use the
>>short-cut method:
>>
>>border { 1px solid #FFF;}
>
>
> Uh ...
>
> #ddblueblockmenu{
> width: 179px;
> border: 1px solid #fff;
> }
>
um... that's what I meant... the OP had all four sides styled
separately,
with 0 for one side... but mentioned he wanted a border on
all sides....
hence my arrow pointing out the side that had 0 for border
and what could
be used as a shortcut method of styling the border....
Maybe my post wasn't exactly clear ;-)
Nadia
Adobe� Community Expert : Dreamweaver
http://www.csstemplates.com.au
- CSS Templates | Free Templates
http://www.perrelink.com.au
- Web Dev
http://www.DreamweaverResources.com
- Dropdown Menu Templates|Tutorials
http://www.adobe.com/devnet/dreamweaver/css.html

Image gallery with scrolling thumbnails?

Hi All,
I am trying to build an image gallery that will contain 1 big picture and a Horizental strip of thumbnails that will allow scroll trough the thumbnails
anyone can explain or point out a good tutorial for this?
Thanx,
Adi

Hi Adi,
do you really ask us for a tutorial, 'cause there are so many nice ready made solutions (with source code, which you could use as a tutorial too), like these:
http://www.efectorelativo.net/laboratory/noobSlide/ Sample 7
http://www.electricprism.com/aeron/slideshow/
http://opiefoto.com/articles/photoslider#example
http://sandbox.scriptiny.com/javascript-slideshow/
and so on...
Hans-Günter

Overlay: image gallery with swipe and page control

Hi,
I'm in my first approach with DPS and I can't understand how to create an image gallery swipe controlled with the page control on the bottom part (page control is rapresented by those little circles on the bottom part of the image that shows how many images are shown by the gallery. See this image for a page control example: http://gtiapps.com/wp-content/gallery/p681_gallery/page1.png ).
I tried to read the documentation and the DPS tips but I can't see this simple kind of gallery.
I'm sure I already saw this kind of gallery in DPS-like apps like Wired, I can't believe is some kind of html based gallery (and if it is, anybody could link me a page where I can get the code snippet for that?).
I'm using inDesign CS6 on OsX.
Please give me some suggestions to get this interaction,
thank you in advance,
Bye!

It's definitely HTML. Here is a list of a whole bunch of them...
http://www.tripwiremagazine.com/2012/12/jquery-carousel.html
I'm a big fan of roundabout at fredhq.com
You can also make something similar using buttons, and an MSO, not quite the same, but if you don't want to delve into HTML, it will do the job. The dots on the bottom can be buttons. I don't have a machine handy to try and see if you can make the MSO swipe blue, but it is worth a try.
A note about using HTML in a folio. Make sure you have the HTML in its own folder, with all the assets needed, but nothing else. Anything else in that folder will also be included in the folio. (I.e. if you just put the HTML in the folder with your indesign doc, when you included the web overlay, the indesign doc, would also be uploaded. Clear folder organization is key for dps projects.

Can someone help me and explain how to affect hotspot/image map with css rules or any other way?

i have problem with hotspot because its position cant be fixed to follow the proportion of the fixed background in different resoulutions.

You can't affect hotspots at all with css. Here are a couple different options you have available though...
You could try using multiple images that scale, linking each individual image, instead of hotspots.
You could also look into "responsive image maps" to get quite a few examples of jquery/javascript run image maps that can be scaled.
Depending on your image, (for example, if you are linking states on a map) you would be able to use SVG paths and link the paths with javascript.

Almost there! Need a little help with CSS Menu

Hi folks,
I am almost there with a menu system. The problems I discovered were mostly to do with layout.css nav elements interfering with my custom code. http://bendannie2.businesscatalyst.com/flexi2.html
Here are the problems I can't seem to resolve.
There appears a red diamond list element and I can't seem to remove it or find it in the Inspector on any css link
the secondary menus blink and are hard to select on hover over tertiary menus (see On Sale>Cartier> )
the tertiary menus are a little crowded towards the secondary menus.
the css classes in inspector seem to repeat ad infinitum
Any help most deeply appreciated...
BTW, it works better on a smart phone!
Jeff

Thanks, Don't know why I didn't see that...
I'm stil having a problem with the hover area for selecting sub menus... The problem appears to be the js, I think!, I'm not qualified to analyze jquery.
The behaviors are as follows:
The On Sale submenus stay active even when you roll off that menu and select another.
The hover area after the first scrollover appears to be below the existing text of the top level and not on the text itself.
there is something going on as you scroll down through the submenus where they are blinking on and off as you pass each sub tab... This uses jQuery 1.7.2, so if that has been fixed in a later edition, I don't know...
Perhaps it is the way I set the CSS but I didn't, to my knowledge, change a hover/selection area for the menus...
TIA,
JEff

PHP Image Gallery with Images placed every other paragraph

Currently I have multiple images that where uploaded to the details page of Post 1. Every other paragraph I have an image displayed. With say 5 images.
What I would like is that the user can click on the image and open up a gallery (on the same page, like Lightbox Gallery) and view through the other 4 images related to Post 1, as these images may not be full resolution on the details page.
If I understand correctly, Lightbox makes a small thumbnail preview of the images, which I don't want, and lists them like a Gallery (Next to each other). Can anyone direct me on the best way to accomplish this?
Thanks,
Riley

Sorry for the confusion, I didn't mean lightbox actually created the thumbnails, but it produces them similar to the link you provided which I don't want. My image uploader does create thumbnail images, but only one per new post.
My format is similar to this:
POST 1
Text Paragraph1 (Image1 )
Text Paragraph1 (               )
Text Paragraph1 (               )
Text Paragraph1 (               )
(Image2) Text Paragraph2
(               ) Text Paragraph2
(               ) Text Paragraph2
(               ) Text Paragraph2
Now what I would like is that they can click on the picture and it opens up the image at say 600px X 600px resolution, with the next/prev buttons so they can browse through only the picutres on this page.
I have been trying to find an example but seems that some take you to a different page of just the image you clicked on, or a new page with the gallery.
I like how the lightbox gallery opens up on the same page, that way you close out of it and can continue reading. But I want to be able to have the images placed in different positions on the page, and not in a row like with a Gallery.
I hope I help clarified what I am trying to do.

Image gallery with CSS menu

Similar Messages

Maybe you are looking for