World Dezign

https://world-dezign.forumotion.com/h48-

how to apply it on my textarea like in WDForum?

I know how to, but tell me, why exactly do you want this?

the same...

Follow this:

- Find the selector for the textarea in quick reply or give it one.
- Choose a height, your css would proberly look like this now.

Code:

SELECTOR HERE {
height : 100px;
}


Code:

SELECTOR HERE:focus {
height : 200px;
}

You can give it UD (: If people ask first we give it but if they just take it without asking, we will report the forum (:

Okay

---

It's specified by the CSS3 transition, here is a generell look for values and properties.

For Google Chrome:

Code:

SELECTOR HERE {
height : 100px;
-webkit-transition : height 1s ease-in-out;
}

Code:

SELECTOR HERE {
height : 100px;
-moz-transition : height 1s ease-in-out;
}

Code:

SELECTOR HERE {
height : 100px;
-o-transition : height 1s ease-in-out;
}

Code:

SELECTOR HERE {
height : 100px;
transition : height 1s ease-in-out;
}

Code:

SELECTOR HERE {
height : 100px;
-webkit-transition : height 1s ease-in-out;
-o-transition : height 1s ease-in-out;
-moz-transition : height 1s ease-in-out;
transition : height 1s ease-in-out;
}

Nice Explaining!

Thanks

---

.daniel I used the example (World Dezign HTML page) you gave to set a speed.

i don't understand!

Just take the last code and add your Quick Reply class/ID (:

What's the quick reply ID?

so:

Code:

TEXTAREA1 {
height : 100px;
-webkit-transition : height 1s ease-in-out;
-o-transition : height 1s ease-in-out;
-moz-transition : height 1s ease-in-out;
transition : height 1s ease-in-out;
}

Code:

#text_editor_textarea.quick_reply_textarea

Thank-you Gangstar. (:

Welcome (:

On a note, how do you find all of these ID's? And when I input the code into my css, it doesn't work.. :(

Code:

#text_editor_textarea.quick_reply_textarea {
height : 100px;
}

#text_editor_textarea.quick_reply_textarea:focus {
height : 200px;
}

#text_editor_textarea.quick_reply_textarea {
height : 100px;
-webkit-transition : height 1s ease-in-out;
-o-transition : height 1s ease-in-out;
-moz-transition : height 1s ease-in-out;
transition : height 1s ease-in-out;
}

View page source and search for them,

Nope.. the code was for #punbb only.

try this code:

Code:

form#quick_reply textarea#text_editor_textarea {
height : 100px;
-webkit-transition : height 1s ease-in-out;
-o-transition : height 1s ease-in-out;
-moz-transition : height 1s ease-in-out;
transition : height 1s ease-in-out;
}

form#quick_reply textarea#text_editor_textarea:focus {
height : 200px;
}



lol... no luck. :(

Give me time to find the correct one

Here:

Code:

form#quick_reply textarea#text_editor_textarea {
-webkit-transition: height 0.4s ease-in-out;
-o-transition: height 0.4s ease-in-out;
-moz-transition: height 0.4s ease-in-out;
transition: height 0.4s ease-in-out;
height: 100px !important;
}
form#quick_reply textarea#text_editor_textarea:focus {
  height: 150px !important;
}


Perfection!

I already have this on my forum for more than a month... lol (After reading the CSS3 Transition tut of course).

Too all other versions on Forumotion, just search for the word Quick Reply (preferably Ctrl + F in most browsers) in the source of the page, and have a look at the id or class. Look for that in your CSS and edit.

Just a note for users of different version forums.

in my forum it don't go!

.daniel what is ur forum version?

PunBB