Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
web package to easily display a linux terminal with css and javascript
JavaScript
branch: master

This branch is 2 commits behind nstephens:master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
css
scripts
README.md
demo.html
demo.png

README.md

CSSTerm

Easy method to display a linux terminal on a webpage using pure CSS, powered by jQuery.

Installation

Place css and javascript files into your existing webpage, including a copy of jQuery
<head>
<link rel="stylesheet" type="text/css" href="css/cssterm.css">
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="scripts/cssterm.js"></script>
</head>

Example

Full Terminal Window html:

<div class="cssterm">
$ uname -a
Linux ThinkPad-X230.localdomain 3.9.6-301.fc19.x86_64 #1 SMP Mon Jun 17 14:26:26 UTC 2013 x86_64 x86_64 x86_64 GNU/Linux

# dmesg | grep sd
[135587.413741] sd 27:0:0:0: Attached scsi generic sg1 type 0
[135587.416697] sd 27:0:0:0: [sdb] 2007040 512-byte logical blocks: (1.02 GB/980 MiB)
[135587.418130] sd 27:0:0:0: [sdb] Write Protect is off
[135587.418140] sd 27:0:0:0: [sdb] Mode Sense: 03 00 00 00
[135587.418944] sd 27:0:0:0: [sdb] No Caching mode page present
[135587.418947] sd 27:0:0:0: [sdb] Assuming drive cache: write through
[135587.423205] sd 27:0:0:0: [sdb] No Caching mode page present
[135587.423211] sd 27:0:0:0: [sdb] Assuming drive cache: write through
[135587.424119]  sdb: sdb1 sdb2
[135587.428088] sd 27:0:0:0: [sdb] No Caching mode page present
[135587.428094] sd 27:0:0:0: [sdb] Assuming drive cache: write through
[135587.428098] sd 27:0:0:0: [sdb] Attached SCSI removable disk
[135588.336077] SELinux: initialized (dev sdb1, type iso9660), uses genfs_contexts

# mkfs.ext4 /dev/sdb1 
mke2fs 1.41.12 (17-May-2010)
Filesystem label=
OS type: Linux
Block size=4096 (log=2)
Fragment size=4096 (log=2)
Stride=0 blocks, Stripe width=0 blocks
245280 inodes, 979456 blocks
48972 blocks (5.00%) reserved for the super user
First data block=0
Maximum filesystem blocks=1006632960
30 block groups
32768 blocks per group, 32768 fragments per group
8176 inodes per group
Superblock backups stored on blocks: 
 32768, 98304, 163840, 229376, 294912, 819200, 884736

Writing inode tables: done                            
Creating journal (16384 blocks): done
Writing superblocks and filesystem accounting information: done

This filesystem will be automatically checked every 20 mounts or
180 days, whichever comes first.  Use tune2fs -c or -i to override.
</div>

output:

Substitution

The following replacements will be made if found at the beginning of a line:

  • lines that start with "#" will be treated as a root command
  • lines that start with "!" will be replaced as a comment
  • include line breaks by placing a space (" ") on an empty line
  • everything else treated as standard output

ToDo

  1. Testing.. Testing.. Testing..

Thanks

Big Thank-You to Dom Briggs over at CSSDeck for his Pure CSS OSX Terminal work

Big Thank-You to Nick Stephens for his CSSTerm work

Something went wrong with that request. Please try again.