Spry slide effect

Hello DW users, Sorry for any redundancy. After posting this
to general forum I realized that it should have gone into the
Dynamic HTML forum. Here goes: I recently made and uploaded a
simple HTML page to test out spry effects on text and images. If
you view the page at
http://student.santarosa.edu/~dnorth/hmwk1.html
you can see what I'm talking about. Everything works fine except
for the "slide" effect. It is set to toggle on in its dialogue box,
but doesn't work like i expected it to. When you click on it, it
slides away and disappears. When I click back in the same area, it
doesn't reappear as I expected it to. I can only get it to come
back if I hit the page refresh button. FYI: the necessary Spry
assets folder and its contents are definitely uploaded as well. Any
suggestions?? Thanks, Deborah North

To make them animate together, you'll need to wrap a div
around the 2 lists:
<div id="example1">
<div>
<ul>...</ul>
<ul>...</ul>
</div>
</div>
since that effect expects the div you are animating to
contain only one element child.
--== Kin ==--

Similar Messages

Spry Slide Effect problem in IE 7 only

I am using the Spry Slide Effect as a way of initially hiding
a drop down menu:
Click on menu of products:
http://www.adelantedesign.co.uk/clients/showpiece/menu.asp
I use:
.hideInitially{
display: none;
as recommended here though there is no working example using
display: none; only visibility: hidden
http://labs.adobe.com/technologies/spry/samples/effects/slide_sample.html
Using initial state of dispay: none it displays NOTHING! Is
this a bug in IE 7?
Anyone come across this problem.
Anyone got a fix?
Thanks
Rich

High Rich,
You were on the right track with EPM. Here's how it works:
http://www.projectseven.com/testing/customers/pow32/
All you do is insert a single panel EPM inside TopMenuWrapper
set to have
all panels close and with gradual stop animation and using
the basic style
theme.
Then you set the trigger DIV to display: none !important; and
to remove all
borders.
.p7EPM05 .p7epm_trigs {
overflow: hidden;
margin-bottom: 12px;
display: none !important;
Then "un-style" the EPM content DIV so it picks up your
colors and
attributes:
.p7EPM05 .p7epm_content {
padding: 12px 24px;
line-height: 1.5em;
border: 0;
Then select your "Menu of Products" link and use the built-in
EPM control
behaviors (available GUI in behaviors panel) to assign an EPM
Trigger
Control to the link, which will then look like this:
<a href="#"
onclick="P7_EPMctl('p7EPMtrg1_1','trigger')">Menu of
Products</a>
That's it.
Al Sparber - PVII
http://www.projectseven.com
The Finest Dreamweaver Menus | Galleries | Widgets
http://www.projectseven.com/go/pop
The Ultimate DW Menu System
"RICH POW" <[email protected]> wrote in
message
news:gms1c0$rpj$[email protected]..
>I am using the Spry Slide Effect as a way of initially
hiding a drop down
>menu:
>
> Click on menu of products:
>
http://www.adelantedesign.co.uk/clients/showpiece/menu.asp
>
> I use:
> .hideInitially{
> display: none;
> }
> as recommended here though there is no working example
using display:
> none;
> only visibility: hidden
>
>
http://labs.adobe.com/technologies/spry/samples/effects/slide_sample.html
>
> Using initial state of dispay: none it displays NOTHING!
Is this a bug in
> IE
> 7?
> Anyone come across this problem.
>
> Anyone got a fix?
>
> Thanks
> Rich
>

How to keep track of the status of a spry slide effect from page to page.

Hi All,
I'm using a spry slide effect on a simple menu system.
Lets say I have a home, gallery and about us page.
I currently have the spry effect occurring with "body onload" only on the Gallery page to slide down extra sub menus only when the user lands on that page.
My problem is that I would like the slide effect to close when having left the page and landed on either of the other two pages. I can close the slide with body onload again but obviously it will close every time regardless of whether the effect was open or closed to begin with.
I know nothing about Javascript or the Spry Framework and therefore would like to know if there is a simple way to track whether the effect was open or closed from page to page?
Ideally I would like the effect to only open when landing on the gallery page and closing only if the previous page was the gallery page and the effect was open. For all other instances the effect should not be actioned.
I thought that there would be a way seeing as there is a toggle option with this effect. How does the effect know when it was previously open/closed and is there a way of parsing that in the URL so that the next page knows what to do?
Any help would really be appreciated.
Thanks

Sorry, but what you wish to do, will require you to at least have a basic understanding of JavaScript and setting/unsetting cookies.
For a basic introduction to using JavaScript try: http://www.adobe.com/devnet/dreamweaver/articles/js_for_designers.html
HTH
PZ

Spry slide effect problem

Hi
i have a div with the slide effect, it works but it start as
showing and i want it to be "shrinked" when the page is loading.
what should i do?
ron

High Rich,
You were on the right track with EPM. Here's how it works:
http://www.projectseven.com/testing/customers/pow32/
All you do is insert a single panel EPM inside TopMenuWrapper
set to have
all panels close and with gradual stop animation and using
the basic style
theme.
Then you set the trigger DIV to display: none !important; and
to remove all
borders.
.p7EPM05 .p7epm_trigs {
overflow: hidden;
margin-bottom: 12px;
display: none !important;
Then "un-style" the EPM content DIV so it picks up your
colors and
attributes:
.p7EPM05 .p7epm_content {
padding: 12px 24px;
line-height: 1.5em;
border: 0;
Then select your "Menu of Products" link and use the built-in
EPM control
behaviors (available GUI in behaviors panel) to assign an EPM
Trigger
Control to the link, which will then look like this:
<a href="#"
onclick="P7_EPMctl('p7EPMtrg1_1','trigger')">Menu of
Products</a>
That's it.
Al Sparber - PVII
http://www.projectseven.com
The Finest Dreamweaver Menus | Galleries | Widgets
http://www.projectseven.com/go/pop
The Ultimate DW Menu System
"RICH POW" <[email protected]> wrote in
message
news:gms1c0$rpj$[email protected]..
>I am using the Spry Slide Effect as a way of initially
hiding a drop down
>menu:
>
> Click on menu of products:
>
http://www.adelantedesign.co.uk/clients/showpiece/menu.asp
>
> I use:
> .hideInitially{
> display: none;
> }
> as recommended here though there is no working example
using display:
> none;
> only visibility: hidden
>
>
http://labs.adobe.com/technologies/spry/samples/effects/slide_sample.html
>
> Using initial state of dispay: none it displays NOTHING!
Is this a bug in
> IE
> 7?
> Anyone come across this problem.
>
> Anyone got a fix?
>
> Thanks
> Rich
>

Trouble applying Spry slide effect option

I am trying to use the SPRY Slide effect. According the Adobe documentation on the
Dreamweaver stuff/Spry_1_6_1_022408/samples/effects/slide_sample.html that I downloaded it says:
“The Slide was designed to animate the element vertically or horizontally. By enabling the horizontal option the element will dissapear [sic] to its left.”
How do you enable this option? I can’t find horizontal on options panel. There is only "up" or "down."

VL Branko wrote:
How do you enable this option? I can’t find horizontal on options panel. There is only "up" or "down."
That option doesn't appear in the Slide effect panel. You need to edit the code inserted by Dreamweaver. Change this:
function MM_effectSlide(targetElement, duration, from, to, toggle)
Spry.Effect.DoSlide(targetElement, {duration: duration, from: from, to: to, toggle: toggle});
to this:
function MM_effectSlide(targetElement, duration, from, to, toggle)
Spry.Effect.DoSlide(targetElement, {duration: duration, from: from, to: to, toggle: toggle, horizontal: true});
Dreamweaver doesn't show all the options available for Spry. You often need to tweak the code manually.

DESPERATE HELP! I broke my spry slide effect

i can't add the effect anymore. everytime i tried, it kept
telling me that I need to have the target element inside a div...
which it is. every other effect works, such as fading or what not.
but the slide effect just gone dead.
also, i did have the effect workED in one of my other
webpage. if i go back to behavior panel and try to modify the
effect (such as changing duration), it won't let me save, but just
kept popping up the same error message as above(that i need to have
target element in a div)
i have no idea what happened. it just stopped working one day
all of a sudden, and becoming very frustrating. PLEASE SOME HELP!!!
(also, where can i get immediate like customer to customer
real time conversation help? i pay LOTS of money for this stuff,
should I expect to get some sort of customer service from them?
some number i can call, some chatroom i can go to?)
p.s. as with all my other silly questions that got answered,
i am sure I did something very beginner (since i am) to break
it.

"Bih Wang" <[email protected]> wrote in
message
news:[email protected]...
>i can't add the effect anymore. everytime i tried, it
kept telling
>me that I
> need to have the target element inside a div... which it
is. every
> other
> effect works, such as fading or what not. but the slide
effect just
> gone dead.
The Slide effect is the most difficult of the Spry effects to
use. You
cannot apply the Slide effect directly to the element you
want to
slide in and out. The target element must be a div wrapped
around it.
What makes it difficult is that the child element of the div
MUST be
one of the following: blockquote, center, dd, form, img, or
another
div. So, for example, this will work:
<div id="slidecontainer">
<img src="slideme.jpg" alt="Sliding image" />
</div>
However, this won't work:
<div id="slidecontainer">
<p><img src="slideme.jpg" alt="Sliding image"
/></p>
</div>
If you want the paragraph, you need to wrap it in another div
like
this:
<div id="slidecontainer">
<div>
<p><img src="slideme.jpg" alt="Sliding image"
/></p>
</div>
</div>
> (also, where can i get immediate like customer to
customer real time
> conversation help? i pay LOTS of money for this stuff,
should I
> expect to get
> some sort of customer service from them? some number i
can call,
> some chatroom
> i can go to?)
This is where you get free user-to-user help. By the way,
please don't
post the same question in multiple forums.
The money you paid for the software entitles you to free
support with
installation problems. You also get two free technical
support tickets
for an individual program. If you bought a suite, you get
four
tickets, and six tickets for the Master Collection. The
technical
support tickets expire 90 days after using the first one.
To get real-time help from Adobe support, you need to
purchase a
support plan, or pay for individual support incidents. In the
USA,
prices per incident range from US$29 to US$249.
David Powers
Adobe Community Expert, Dreamweaver
http://foundationphp.com

Spry Slide Effect - Vertical Only?

Is there a way to make things slide horizontally?

Bopjo wrote:
> Is there a way to make things slide horizontally?
Yes.
http://labs.adobe.com/technologies/spry/samples/effects/slide_sample.html
David Powers, Adobe Community Expert
Author, "The Essential Guide to Dreamweaver CS4",
"PHP Solutions" & "PHP Object-Oriented Solutions"
http://foundationphp.com/

Spry slide effect and loading image

I'm using a "slide down effect" for a image, but when open
the page in the browser, the image appear (for 1 second) before to
start the effect... is possible hidden the image and view it only
when the slide effect start?
thanks

Depending on how you want it handled, you can add a css style
to either the image or the div in order to hide it before the fade.
display:none;
or
visibility:hidden;

Problem with applying Spry "Slide Effect"

I am having problems attaching the slide effect on image. Below is the code for the test page I am working on to learn how to use this effect (most of which came from Adobe):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="../SpryAssets/SpryEffects.js"></script>
</head>
<body>
<p> </p>
<p> </p>
<style type="text/css">
#content{ visibility: hidden;}
</style>
<div id="content">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce vel sem nec massa cursus
interdum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos
hymenaeos. Duis euismod eros consequat nibh. Pellentesque non purus. Nam lectus magna, faucibus
vel, aliquet id, commodo vitae, elit. Maecenas sollicitudin, nibh iaculis bibendum consequat,
odio erat volutpat ipsum, sed dignissim ligula mi in justo. Nam placerat. Nullam fringilla
tortor. Quisque lacinia, mi non iaculis adipiscing, turpis lacus eleifend velit, dictum
facilisis pede diam sagittis nulla. Nunc vestibulum elementum enim. Etiam lorem felis, faucibus
sit amet, vulputate sed, lobortis et, nunc. Morbi vitae lectus.
</div>
<p> </p>
<p> </p>
<div id="chakra">
<p><img src="../images/chakra_yantra_200px.jpg" alt="chakra" width="200" height="201" /></p>
</div>
</body>
</html>
The idea is that there is an image called "chakra", and when the mouse goes over the image then the text is suposed to slide out as a caption.
When I attempt to attach the effect after selecting the image I am asked to ***Select Target Element ID*** of which there are two options
div "content"
and
div "chakra"
I choose -- div "content"
I then get an error message that says:
“To get this behavior to work properly, you must select the container tag you want to slide. (For example, if you want to slide an <image> tag that is wrapped with the <div> tag, select the container <div> tag. The container tag must have a unique ID.)
Please select a container tag as your target element , or cancel the behavior, wrap your target element with a div tag, assign the new div tag a unique ID, and reapply the behavior. When you reapply the behavior, select the new div tag as your target element.
The action will not be added to your document.”
What am I doing wrong?
I have spent hours on this but not getting anywhere. Are there any good visual tutorials to explain this? I have read everything that Adobe has provided but I am still not getting it, but I am getting a head ache. )-:
I'm using DW CS5 on a Mac, OS X 10.6.6

Add a div element as follows
<div id="content">
<div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce vel sem nec massa cursus
interdum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos
hymenaeos. Duis euismod eros consequat nibh. Pellentesque non purus. Nam lectus magna, faucibus
vel, aliquet id, commodo vitae, elit. Maecenas sollicitudin, nibh iaculis bibendum consequat,
odio erat volutpat ipsum, sed dignissim ligula mi in justo. Nam placerat. Nullam fringilla
tortor. Quisque lacinia, mi non iaculis adipiscing, turpis lacus eleifend velit, dictum
facilisis pede diam sagittis nulla. Nunc vestibulum elementum enim. Etiam lorem felis, faucibus
sit amet, vulputate sed, lobortis et, nunc. Morbi vitae lectus.</div>
</div>
Gramps

SPRY Slide effect change horizontal slide direction?

I'm working on this website:
http://www.ryanlum.com/clients/sge/index.html
I was able to change the slide direction from vertical to
horizontal, but I am unable to change the direction of the slide.
It currently opens from the left and goes to the right. I'd like to
change the direction so it opens up from the right and expands
left. Where do I go to change this option? I'd reallllyyy
appreciate help!

I don't have an answer to your question, but I was wondering
if you would be so kind as to explain how you got the effect to
slide horizontally instead of vertically?

Problem with Spry:Repeat and Slide Effect on IE6

I run the website for my kids' hockey association and I'm not
a web programmer. I am trying to display events in a Spry region
using spry:repeat. The data is coming from a Google Calendar . I
display the event date and title on the main page. I have the
onclick set to call a javascript function that exposes the details
using the spry slide effect. It works ok except in IE6.
The following creates my dataset from a method call to a
Coldfusion component that returns the XML I need:
<script type="text/javascript">
var ds1 = new Spry.Data.XMLDataSet("
http://tornadoyouthhockey.org/Events.cfc?method=EventXML",
"events/event",{distinctOnLoad:false});
</script>
The following function slides open the detail:
<script type="text/javascript">
function startBlind(rid) {
var contentdiv = document.getElementById('panel'+ rid
+'Content');
var panel_height = contentdiv.clientHeight;
if (panel_height<100){
var bd = new Spry.Effect.Blind('panel'+ rid +'Content',
{duration: 800, to: '100px', toggle: true});
else {
var bd = new Spry.Effect.Blind('panel'+ rid +'Content',
{duration: 800, to: '0px', toggle: true});
bd.start();
</script>
Within the repeat I have:
<div class="EventPanelLabel"
onclick="startBlind({ds_RowID});">{startDate} —
{title}</div>
I think the XML looks OK but for some reason when the page
loads, IE6 returns:
Exception caught while loading
http://tornadoyouthhockey.org/Events.cfc?method=EventXML:
[object Error]
The page seems to work fine in Safari and Firefox on the Mac
and IE7 as well as Firefox on Windows. Just IE6 seems to be having
the problem. Could you please take a look at
http://tornadoyouthhockey.org
and provide any suggestions you may have?
Also, is there a way to hide the {startDate} - {title} I'm
seeing while the page loads?
Thanks,
Kevin

Kin:
Thanks for your reply. I made the changes you suggested but,
unfortunately, IE6 is still giving me the same error when the page
loads:
Exception caught while loading
http://tornadoyouthhockey.org/Events.cfc?method=EventXML:
[object Error]
Could this be part of the problem an need to be changed as
well? :
<div id="panel{ds_RowID}Content"
Any other ideas? The page is live if you'd care to look...
http://tornadoyouthhockey.org
Kevin

Slide Effect problem in IE 7 only

I am using the Spry Slide Effect as a way of initially hiding
a drop down menu:
Click on menu of products:
http://www.adelantedesign.co.uk/clients/showpiece/menu.asp
I use:
.hideInitially{
display: none;
as recommended here though there is no working example using
display: none; only visibility: hidden
http://labs.adobe.com/technologies/spry/samples/effects/slide_sample.html
Using initial state of dispay: none it displays NOTHING! Is
this a bug in IE 7?
Anyone come across this problem.
Anyone got a fix?
Thanks
Rich

Actually, since EPM allows page links as well as Panel
triggers, you can do
your whole menu bar in EPM using real triggers and you would
then have all
the benefits of state management for those links. That is,
when you click
the "Menu of Products" link to expand the elevator, the link
would adapt an
open state style class.
"Al Sparber - PVII" <[email protected]>
wrote in message
news:[email protected]...
> High Rich,
>
> You were on the right track with EPM. Here's how it
works:
>
http://www.projectseven.com/testing/customers/pow32/
>
> All you do is insert a single panel EPM inside
TopMenuWrapper set to have
> all panels close and with gradual stop animation and
using the basic style
> theme.
>
> Then you set the trigger DIV to display: none
!important; and to remove
> all borders.
>
> .p7EPM05 .p7epm_trigs {
> overflow: hidden;
> margin-bottom: 12px;
> display: none !important;
> }
>
> Then "un-style" the EPM content DIV so it picks up your
colors and
> attributes:
>
> .p7EPM05 .p7epm_content {
> padding: 12px 24px;
> line-height: 1.5em;
> border: 0;
> }
>
> Then select your "Menu of Products" link and use the
built-in EPM control
> behaviors (available GUI in behaviors panel) to assign
an EPM Trigger
> Control to the link, which will then look like this:
> <a href="#"
onclick="P7_EPMctl('p7EPMtrg1_1','trigger')">Menu of
> Products</a>
>
> That's it.
>
>
> --
> Al Sparber - PVII
>
http://www.projectseven.com
> The Finest Dreamweaver Menus | Galleries | Widgets
>
http://www.projectseven.com/go/pop
> The Ultimate DW Menu System
>
>
>
>
> "RICH POW" <[email protected]> wrote in
message
> news:[email protected]...
>>I am using the Spry Slide Effect as a way of
initially hiding a drop down
>>menu:
>>
>> Click on menu of products:
>>
http://www.adelantedesign.co.uk/clients/showpiece/menu.asp
>>
>> I use:
>> .hideInitially{
>> display: none;
>> }
>> as recommended here though there is no working
example using display:
>> none;
>> only visibility: hidden
>>
>>
http://labs.adobe.com/technologies/spry/samples/effects/slide_sample.html
>>
>> Using initial state of dispay: none it displays
NOTHING! Is this a bug
>> in IE
>> 7?
>> Anyone come across this problem.
>>
>> Anyone got a fix?
>>
>> Thanks
>> Rich
>>
>

Slide Effect within a Table

I'm trying to add a simple Spry slide effect to some text on
one of my web sites, however the text dissapears in IE7. I've
managed to cut it down to the most basic code where the problem
occurs and it turns out to be a table cell. I took the slide
example and cut it down until it doesn't work. I'm referencing the
css and js that comes with the spry 1.6 prerelease build. This code
works fine in Firefox. If you remove the table tags, it also works
in IE7. However, with the table tags present, the text doesn't show
up at all in IE7 (although the background color does slide up and
down). I'd like to be able to keep the table tags in my actual site
because it helps to keep the shape of the page. I can't believe
know one else has run into this issue, but I haven't found anything
online. If you have any tips, please let me know. Otherwise,
consider this a bug report.
Here's the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional-dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Spry Slide Effects Sample</title>
<link href="../../css/samples.css" rel="stylesheet"
type="text/css" />
<script src="../../includes/SpryEffects.js"
type="text/javascript"></script>
<style type="text/css">
.animationContainer{
height: 220px;
.demoDiv{
background-color: #CCC;
height: 200px;
overflow: hidden;
.hideInitially{
visibility: hidden;
</style>
</head>
<body>
<table><tr><td>
<form method="get" action="grow_sample.html">
<input type="button" onclick="slide_hidden.start();"
value="Slide Example" />
</form>
<div class="animationContainer">
<div class="demoDiv hideInitially" id="example5">
<p><strong>Example - Slide from 0% to 100% in 2
seconds</strong>
<br />
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed
diam nonumy eirmod tempor invidunt ut labore et dolore magna
aliquyam erat, sed diam voluptua. At vero eos et accusam et
justo duo dolores et ea rebum. Stet clita kasd gubergren, no
sea takimata sanctus est Lorem ipsum dolor sit
amet.</p></div>
</div>
<script type="text/javascript">
var slide_hidden = new Spry.Effect.Slide('example5',
{duration: 500, from: '0%', to: '100%', toggle:true});
</script>
</td></tr></table>
</body>
</html>

I am also having this problem. I've written a custom JSF
component that could technically be used in all sorts of situations
within an HTML page. During the initial component development, the
case of adding the component within a table on IE was never tested.
Only later when some other developer was reusing the component in
another project did the Slide effect within a table in IE issue
crop up. As it's a JSF component, there really isn't a very elegant
way to move the javascript to another location within the HTML page
and a previous poster pointed out. Help!

Slide effect - change dinamically from to

Hi,
i try to build a slide effect (v1.5) for change dinamically
the options 'from' and 'to', the scope is obtain a graphic
interface for domotics application (eg. open sliding-windows to
25%)
i used this sample code, but the value in the effect not
change:
<input type="button" onclick="slide.options.to='25%';"
value="Set To 25%">
<input type="button" onclick="slide.options.to='50%';"
value="Set To 50%">
<input type="button" onclick="slide.options.to='75%';"
value="Set To 75%">
<input type="button" onclick="slide.options.to='100%';"
value="Set To 100%">
<input type="button" onclick="alert(slide.options.to);"
value="CHECK">
<input type="button" onclick="slide.start();"
value="START">
<div id="slidingWindows">
<div>
<div>img src="images/window.jpg" alt="" border="0"
/></div>
</div>
</div>
<script type="text/javascript">
var slide = new Spry.Effect.Slide('slidingWindows',
{duration: 2000, from: '0%', to: '25%', toggle: false,
scaleContent:true});
</script>
Thanks!

Hello,
The percent values are translated in pixel values when the
effect is instantiated. The result is cached and later used in each
of the animators. If you manually set a new value the effect will
ignore those values.
Your problem is a little bit more complicated. You'll have to
create a more complex script that will instantiate on the fly a new
effect for each button when that button is clicked. Because when
you instantiate an effect another effect it is possible to have run
the percent value will be considered from the current size and not
from the old original size. In this situation we'll have to also
compute manually before effect instantiation the pixel value
against the maximum one:
<input type="button" onclick="slideIt('25%');" value="Set
To 25%">
<input type="button" onclick="slideIt('50%');" value="Set
To 50%">
<input type="button" onclick="slideIt('75%');" value="Set
To 75%">
<input type="button" onclick="slideIt('100%');" value="Set
To 100%">
<input type="button" onclick="alert(slide.options.to);"
value="CHECK">
<input type="button" onclick="slide.start();"
value="START">
<div id="slidingWindows">
<div>
<div><img src="images/window.jpg" alt="" border="0"
/></div>
</div>
</div>
<script type="text/javascript">
function slideIt(to){
var percent = parseInt(to, 10);
// 300 is a random chose value.
var pixels = to * 300 / 100;
slide = new Spry.Effect.Slide('slidingWindows', {duration:
2000, from: '0px', to: pixels + 'px', toggle: false, scaleContent:
true});
// the default value is 25%
slideIt('25%');
</script>
Regards,
Cristian

How to set the default behavior of slide effect?

Basically, I am using the spry widget that allow me to do the
click and expand (like how sections get slide up and down) effect.
(Sorry if I don't know the term, I am running a Chinese version...
if it helps at all... it's "滑動" in chinese character)
Is there any way to set it so that the object that being
hidden/revealed stay hidden from the start before the click?
Because of the way I have all my layouts setup, it really destroy
the view if it's revealed from the start.
Thanks in advance!

It seems like the same one, but I can't find the accordion
keyword in any of my code. I have this... which I guess is the code
generated when I insert the widget
"function MM_effectSlide(targetElement, duration, from, to,
toggle)
Spry.Effect.DoSlide(targetElement, {duration: duration,
from: from, to: to, toggle: toggle});
is that the same thing? how would I change it according to
the instruction?
i found the slide effect thing on adobe lab and found out how
to have the element hide initially (by adding display: none; to my
css), but then another weird problem.
i have 8 divs wrap inside a big div "Main" which would be
slid up and down. "Main" slid up and down as expected, but one of
the small div (the first one to be precise) simply disappeared. the
margin that I set for it still display correctly (I set the div to
be 140 px, and there is a 140 px space), but no content (I have a
mouseswap image),
when I remove the display: none; code from the div "Main"
part of the css, then the small div display correctly, with the
mouse swap image.
Did I do something wrong?

Spry slide effect

Similar Messages

Maybe you are looking for