Highlighted

Effects/shrink/grow

New Here ,
Sep 26, 2020

Copy link to clipboard

Copied

Hi, I would like to use CS3 Effects - Shrink/Grow behaviour on multiple jpg. images throughout my site.  The application works fine for my purpose.  Is there any way that I can change the default selections in the Grow/Shrink panel.  Eg. it opens up the panel with Shrink - I select Grow...  Shrink to Centre - I want Top Left Corner... Toggle Effect is un-ticked - I want to tick box.  This would save me a great amount of time.  I have tried copy and paste the working code to each image/page but get myself in to an aweful pickle.  Thank you for any help.

Views

132

Likes

Translate

Translate

Report

Report
This conversation has been locked.

Effects/shrink/grow

New Here ,
Sep 26, 2020

Copy link to clipboard

Copied

Hi, I would like to use CS3 Effects - Shrink/Grow behaviour on multiple jpg. images throughout my site.  The application works fine for my purpose.  Is there any way that I can change the default selections in the Grow/Shrink panel.  Eg. it opens up the panel with Shrink - I select Grow...  Shrink to Centre - I want Top Left Corner... Toggle Effect is un-ticked - I want to tick box.  This would save me a great amount of time.  I have tried copy and paste the working code to each image/page but get myself in to an aweful pickle.  Thank you for any help.

Views

133

Likes

Translate

Translate

Report

Report
Sep 26, 2020 0
Adobe Community Professional ,
Sep 27, 2020

Copy link to clipboard

Copied

I'm sorry, I don't know what Shrink/Grow panel you're talking about.  Maybe what you're looking for is a CSS Pulse animation effect? See link below for code and examples.

https://www.geeksforgeeks.org/css-pulse-animation/

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Sep 27, 2020 0
New Here ,
Sep 28, 2020

Copy link to clipboard

Copied

Hi Nancy, thank you for your reply.  The panel that I am talking about can be found in WINDOWS / BEHAVIOURS / EFFECTS / Shrink/Grow tab. (behaviour/attributes opens on R/H/S above FILES column).  Click on Behaviours and the + sign.  It will open a drop down menu.  Choose EFFECTS and then choose Shrink/Grow a panel will appear. see pic attached.  You need to have the image in the page selected and then you can apply the effect to it.  You can see that the panel opens with a default selection.  I have to change [Shrink] to [Grow].....[Centre] change to [Top Left Corner] and tick the un-ticked box.  I have many pages with images on that I wish to apply this to... My question is, can I somehow change the defaults in that panel when it is opened to show [Grow]... [Top Left Corner] and box already ticked as the new defaults.  The application works fine as it is....but I have to change these settings each time I open the panel.  Effects Panel.JPG

Likes

Translate

Translate

Report

Report
Sep 28, 2020 0
Adobe Community Professional ,
Sep 28, 2020

Copy link to clipboard

Copied

Which version of DW do you have? I don't have a Shrink/Grow option in my Behavior Effects. 

I have no idea if panel default settings can be changed permanently or not. I've never gone looking for them in the programming code. 

 

 

 

 

 

 

 

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Sep 28, 2020 0
LEGEND ,
Sep 28, 2020

Copy link to clipboard

Copied

What is it you are exactly trying to do? There may be a simple copy and paste solution rather than having to select each individual image and use a User Interface to apply the attributes, which can be really, really slow if you have a number of images that you need to apply the effect to.

Likes

Translate

Translate

Report

Report
Sep 28, 2020 0
Adobe Community Professional ,
Sep 28, 2020

Copy link to clipboard

Copied

This is HTML5 and pure CSS code.  No MM behaviors, no jQuery & no JavaScript.

 

image.png

 

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pure CSS Effects</title>
<style>
/**Basic Layout**/
body{background:antiquewhite;}

.container {
width: 98%;
margin: 0 auto;
}

/* Special Rules for devices over 700px wide */
@media only screen and (min-width: 699px) {
.container {
width: 90%;
display: flex;
flex-direction: row;
align-items: flex-end;
justify-content: space-around;
}
}

img {
max-width: 100%;
vertical-align: baseline;
}
/**CSS Animation**/
.grow {
transform: scale(50%);
transition: 1000ms;
transition-property: transform;
}
.grow:hover { transform: scale(100%); }

.shrink {
transform: scale(100%);
transition: 1000ms;
transition-property: transform;
}
.shrink:hover { transform: scale(50%); }
</style>
</head>

<body>
<div class="container">
<div>
<h3>Mouseover to Grow Image</h3>
<img class="grow" src="https://dummyimage.com/400x350" alt="placholder"> </div>
<div>
<h3>Mouseover to Shrink Image</h3>
<img class="shrink" src="https://dummyimage.com/400x350" alt="placholder"> </div>
</div>
</body>
</html>

 

Post back if you have any questions.

 

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Sep 28, 2020 1
New Here ,
Sep 30, 2020

Copy link to clipboard

Copied

Hi Nancy, thank you for your time and your suggestion/code.  I have discovered that I can type 'E' to open the [Effect Menu], 'G' for the [Shrink/Grow] panel and I can tab through each selection and type the first letter of the selection and it will fill with the result that I want.  eg. type 'G' in the shrink box and [Grow] will appear.  TAB to the next selection and type 'T' and [Top Left Corner] will appear TAB again and press Space Bar and [A Tick] will appear in the empty box.  Not fantastic but a lot easier to use, than going through each drop down and selecting.  Thank you also to all who read my post.  All the best, kind regards.

Likes

Translate

Translate

Report

Report
Sep 30, 2020 0