Chatroom CSS

Status: Closed
Prize: $250
Entries Received: 20
Winner: SkyWorks123

Winner

Contest Brief

Attached is a picture of a basic chat room on my website, using jQuery. The chat room is a one-on-one room.

I would like a functioning chat room designed in flawless CSS similar to this however it should have the following features:

1) Above this chat should info on the user talking to, showing their profile picture, name, and a dot which will show 3 different variations of colours: Green = in the chat room now. Yellow = online on website but not in chat room, Grey = Not online.

2) In the chat box will show, user name of each person's message, the message, time of message. The last message in the chat by the other person, will also need a section to show "Read". Example: If User A types: "Yes please. Thank you", once User B has read this message, User A will be able to see a simple "Read" to know they have seen it.

3) At the moment I was unable to get the chat box to scroll to the bottom. So I put the input box up top and have the messages appearing in descending order. However, I would prefer the chat box to scroll in ascending order, but it would need to reload at the bottom of the div. The input box when then also go on the bottom.

I have included the website logo as well, so you get an idea of the kind of colours used - however I am after a clean design, not for the colours to be overbearing.

Recommended Skills

CSS
HTML

Winner

Post a Contest Like This

Employer Feedback

“The work was excellent however the support afterwards was FANTASTIC! Will definetely be hiring again.”

greff1978, Australia.

Public Clarification Board

SkyWorks123
- 9 years ago
Please wait for my entry
- 9 years ago
gcStudioOrg
- 9 years ago
please have a look at update #10 thanks
- 9 years ago
gcStudioOrg
- 9 years ago
Hello, I've leave some comments regarding my entry, please have a look, thanks
- 9 years ago
1. Contest Holder
  - 9 years ago
  Have replied :)
  - 9 years ago
ayubhassan
- 9 years ago
Hello sir , Do you want only HTML/CSS or functionality also.
- 9 years ago
1. Contest Holder
  - 9 years ago
  We already have the functionality. The chatbox operates under jQuery. However we want a more stylish, fluent and professional design.
  - 9 years ago
gcStudioOrg
- 9 years ago
Just to be sure, the design should be in pure css?
- 9 years ago
1. Contest Holder
  - 9 years ago
  Yes. We already have the functionality. The chatbox operates under jQuery. However we want a more stylish, fluent and prfessional design.
  - 9 years ago
rajibdebslg
- 9 years ago
Hi, I have developed many chat application, and this is easier for me. Please come to chat so that I can discuss more. Regards, Rajib
- 9 years ago
1. Contest Holder
  - 9 years ago
  Which chat?
  - 9 years ago
2. rajibdebslg
  - 9 years ago
  http://dazzleblue.com/
  - 9 years ago
anshitaagrawal
- 9 years ago
Hi Sir,
Do you want chat box like gmail chat box
- 9 years ago
1. Contest Holder
  - 9 years ago
  I have never used gmail chat. I am not after any other features other than what has been discribed.
  - 9 years ago