Today's Posts Follow Us On Twitter! TFL Members on Twitter  
Forum search: Advanced Search  
Navigation
Marketplace
  Members Login:
Lost password?
  Forum Statistics:
Forum Members: 24,256
Total Threads: 81,169
Total Posts: 566,839
There are 36 users currently browsing (tf).
 
  Our Partners:
 
  TalkFreelance     Design and Development     Programming     Javascript :

Styling specifics within an input?

Thread title: Styling specifics within an input?
Reply    
    Thread tools Search this thread Display Modes  
03-20-2011, 03:50 AM
#1
Dan is offline Dan
Dan's Avatar
Status: Request a custom title
Join date: Feb 2005
Location:
Expertise:
Software:
 
Posts: 3,164
iTrader: 15 / 86%
 

Dan is an unknown quantity at this point

  Old  Styling specifics within an input?

For example (I know it wouldn't be done like this btw)

Code:
<input value="I am <color=red>red</color>." />
Possible using JS?

Google solutions suggest silly jibberish like overlaying DIVs and whatnot. Do not want extra markup really.

03-20-2011, 01:42 PM
#2
Eightloop is offline Eightloop
Eightloop's Avatar
Status: Member
Join date: Jan 2011
Location:
Expertise: Programming, photography
Software: Notepad++, Photoshop
 
Posts: 112
iTrader: 0 / 0%
 

Eightloop is an unknown quantity at this point

  Old

Do you mean something like this?
http://www.eightloop.com/demo/redinput.html

This can easily be done with CSS by using classes. (Check the source code of the file to see how.)

03-20-2011, 03:48 PM
#3
Dan is offline Dan
Dan's Avatar
Status: Request a custom title
Join date: Feb 2005
Location:
Expertise:
Software:
 
Posts: 3,164
iTrader: 15 / 86%
 

Dan is an unknown quantity at this point

  Old

Thanks, but no, not like that.

Reply With Quote
03-20-2011, 05:07 PM
#4
Village Genius is offline Village Genius
Village Genius's Avatar
Status: Geek
Join date: Apr 2006
Location: Denver, CO
Expertise: Software
Software: Chrome, Notepad++
 
Posts: 6,892
iTrader: 18 / 100%
 

Village Genius will become famous soon enough

  Old

There is no simple way to do this, HTML just doesn't have functionality for that out of the box. You're going to have to use some "tricks" involving overlay divs and such. This is why I don't do front end coding; I hate it.

JS stuff can only manipulate HTML and CSS, it cant do anything that HTML and CSS couldn't do without it. JS just automates the process and can put logic behind it. Any JS stuff would involve the same tricks, perhaps with a little more complication.

03-20-2011, 09:22 PM
#5
Eightloop is offline Eightloop
Eightloop's Avatar
Status: Member
Join date: Jan 2011
Location:
Expertise: Programming, photography
Software: Notepad++, Photoshop
 
Posts: 112
iTrader: 0 / 0%
 

Eightloop is an unknown quantity at this point

  Old

I think I understand your question now. :-) Okay, I can't answer your question, but here's what I got:

I believe that WordPress is using this feature in the visual editor. I don't know how they've done it, but it seems to me that it's using javascript to transform to transform the html code.

Maybe you can find the javascript code, I couldn't find it.

Reply With Quote
03-21-2011, 02:13 AM
#6
Dan is offline Dan
Dan's Avatar
Status: Request a custom title
Join date: Feb 2005
Location:
Expertise:
Software:
 
Posts: 3,164
iTrader: 15 / 86%
 

Dan is an unknown quantity at this point

  Old

Thought as much, thanks anyway.

@Eightloop Isn't WP visualeditor not an actual input/textarea?

Reply With Quote
Reply    


Thread Tools
Display Modes

  Posting Rules  
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump:
 
  Contains New Posts Forum Contains New Posts   Contains No New Posts Forum Contains No New Posts   A Closed Forum Forum is Closed