| We hope you enjoy your visit. You're currently viewing our forum as a guest. This means you are limited to certain areas of the board and there are some features you can't use. If you join our community, you'll be able to access member-only sections, and use many member-only features such as customizing your profile, sending personal messages, and voting in polls. Registration is simple, fast, and completely free. Join our community! If you're already a member please log in to your account to access all of our features: |
| [ C ] Rainbow Text | |
|---|---|
| Tweet Topic Started: May 14 2013, 07:02 PM (850 Views) | |
| RichardInTN | May 14 2013, 07:02 PM Post #1 |
|
I believe in I.D.I.C.
![]() ![]() ![]() ![]() ![]()
|
Board Address: Great Escape Board Software: ZetaBoards Description: A member of my board has asked me to see if it's possible to get a button that creates a "rainbow" effect across a line of text. I saw a "BB Code" option on another forum HERE that does exactly what I am looking for, and I was wondering if it would be possible here as something that could be added to the general board template. Ideally I'd like another [button] in both the "Full Reply" screen and in the "Edit Signature" screen as those are the two places I can imagine it being used. Anyone have any ideas (preferably without adding in color codes around every single letter, thus making it impossible to read when quoting)? |
![]() |
|
| Cory | May 14 2013, 08:14 PM Post #2 |
|
Member
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]()
|
Use this code (remove a.member) and this code:
Edited by Cory, May 14 2013, 08:23 PM.
|
![]() |
|
| RichardInTN | May 14 2013, 08:35 PM Post #3 |
|
I believe in I.D.I.C.
![]() ![]() ![]() ![]() ![]()
|
Remove "a.member"? JUST that... or everything after it or what? And that one (according to what it says) doesn't rainbow a line of text, it just cycles through 7 colors, one at a time, then repeats... as often as necessary. I was looking for something that would be one "rainbow" across the entire line of text (like can be seen on my example, 4th code from the bottom). |
![]() |
|
| Cory | May 14 2013, 08:44 PM Post #4 |
|
Member
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]()
|
Basically, change $('a.member span.bbcode-rainbow') to $('span.bbcode-rainbow') in the code. As many colors as you'd like can be added to the array and the 7 (i % 7) will have to be changed to the amount of colors used in the array. |
![]() |
|
| RichardInTN | May 14 2013, 08:59 PM Post #5 |
|
I believe in I.D.I.C.
![]() ![]() ![]() ![]() ![]()
|
But wouldn't that still limit it to a specific color to every {whatever number} letter, instead of one fade across the entire line? Since lines of text will be variable as to the number of characters in them, there's no way to specify the appropriate number of colors in that code. ETA: I signed up on the site I linked in my OP so I could test the function of their version, and the following created ONE fade of rainbow color across the entire line of text:
Edited by RichardInTN, May 14 2013, 09:12 PM.
|
![]() |
|
| Cory | May 14 2013, 09:14 PM Post #6 |
|
Member
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]()
|
So, you had something like this in mind?
|
![]() |
|
| RichardInTN | May 14 2013, 09:30 PM Post #7 |
|
I believe in I.D.I.C.
![]() ![]() ![]() ![]() ![]()
|
Exactly... but without all the color codes wrapped around each letter (like it is in your example) so it was still legible when writing up the reply while quoting.
Edited by RichardInTN, May 14 2013, 09:31 PM.
|
![]() |
|
| Cory | May 15 2013, 06:40 PM Post #8 |
|
Member
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]()
|
Admin CP Themes Board Template JavascriptsAdmin CP Themes Board Template Below the BoardRainbow script found on the web. |
![]() |
|
| RichardInTN | May 15 2013, 06:48 PM Post #9 |
|
I believe in I.D.I.C.
![]() ![]() ![]() ![]() ![]()
|
Works great! One question though... the colors aren't in "Red, Orange, Yellow, Green, Blue, Indigo, Violet" order... was that a boo-boo... or the only way to get it to work here? ETA: after playing with it a bit... it has a weird bug in it. It drops out parts of text sometimes from the middle, sometimes just truncating the post. for one example, I copied a couple of paragraphs from wikipedia on rainbows, and then "surrounded" it with the [rainbow] and [/rainbow] tags. Here's what I posted:
Here's what I got (it did have the "rainbow" effect): and the rest was "there"... it was just invisible (I could see it when highlighted). And, weirdly enough, the part that WAS "rainbowed" was done appropriately, color-wise (only part of the rainbow effect appeared). ETA II: if you look at the Original Post in THIS THREAD something REALLY weird happens... the missing part JUMPS into place when highlighted. Edited by RichardInTN, May 15 2013, 07:13 PM.
|
![]() |
|
| Cory | May 15 2013, 07:31 PM Post #10 |
|
Member
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]()
|
The script isn't really mine to edit, it was found here. |
![]() |
|
| RichardInTN | May 15 2013, 07:49 PM Post #11 |
|
I believe in I.D.I.C.
![]() ![]() ![]() ![]() ![]()
|
I can live with the colors not being in order. Any ideas on why it's altering the text? |
![]() |
|
| SlyCooperFan1 | May 15 2013, 09:59 PM Post #12 |
![]()
Coder
![]() ![]() ![]() ![]() ![]() ![]()
|
I found the problem. The code is currently inputting the text into a <span> like this:It appears that the -webkit-background-clip CSS property has not been optimized as of yet with the <span> tag. Using the Developer Tools on Chrome, I was messing around with a bunch of things to see what would work, and it turns out that it works perfectly if the text is put into a <div> instead of a <span> like this: So Cory, if you just edit your hosted code to change the span to a div, it should work as intended. |
![]() |
|
| Cory | May 15 2013, 10:08 PM Post #13 |
|
Member
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]()
|
It has been done. |
![]() |
|
| RichardInTN | May 15 2013, 10:14 PM Post #14 |
|
I believe in I.D.I.C.
![]() ![]() ![]() ![]() ![]()
|
That fixed it! You guys are both RockStars! ETA: One strange thing (I actually LIKE IT though!) it doesn't spread the effect from the [rainbow] to the [/rainbow], it's like it takes a picture of the whole paragraph or multiple paragraphs, and rainbows the whole thing as one, from left to right. Unexpected... but COOL. Edited by RichardInTN, May 15 2013, 10:28 PM.
|
![]() |
|
| Helena | May 18 2013, 07:19 PM Post #15 |
![]()
M is for Mod
![]()
|
Completed! Your request has been completed. If you have any questions or concerns regarding the state of your request, please feel free to contact me via PM. |
![]() |
|
| 1 user reading this topic (1 Guest and 0 Anonymous) | |
| « Previous Topic · Closed Requests · Next Topic » |
| Track Topic · E-mail Topic |
8:57 PM Jul 10
|


![]](http://b1.ifrm.com/0/1/0/p601690/pipright.png)


Themes 


8:57 PM Jul 10