<b>REGISTER</b>

GFX-Sector - HTML, CSS


 
GFX-Sector » Coding Area » Webentwicklung » HTML, CSS » Projektfortschrittsbalken » Hello Guest [Login|Register]
Last Post | First Unread Post Print Page | Recommend to a Friend | Add Thread to Favorites

HTML, CSS
Einfache Scriptsprachen und deren Layout mit HTML und CSS
Post New Thread Post Reply

Projektfortschrittsbalken

     Deutsche Version  English version
Author
Post « Previous Thread | Next Thread »

!RaZo! !RaZo! is a male
Fingerwischer

Spender


Avatar von !RaZo!

Registration Date: 03.03.2008
Posts: 30
Location: Bad Oldesloe
Program: Photoshop CS3

Spacer
Projektfortschrittsbalken

Projektfortschrittsbalken

       
Hallo Jungs, ich hab mal eine kleine bescheidene Frage. und zwar wie würde man so ein Balken (s. Threadtitel) hinbekommen
Ich will in meinem Admin interface zum beispiel denn eine übersicht über meine projekte haben und dann ein Feld wo ich ne Prozentsatz eintrage

Dann soll ein Balken bei meiner Projektübersicht halt anzeigen wie weit ich bin
am besten denn von 0-100 % und von Farbe rot - gelb - grün
Und natürlich das ganze mit Bildern

ICh hab nun versucht mit tables zu arbeiten aber das bekomm ich net gebacken.
Wird sowas sonst in css realisiert oder doch eher so Js oder Ajax???

also ich bräuchte irgendwie nen kleinen hinweis wie ich anfangen könnte, wäre nett wenn ihr mir helfen könntet.

Danke im voraus
Projektfortschrittsbalken 03.05.2008 22:50 !RaZo! is offline Search for Posts by !RaZo!

Fireball Fireball is a male
Boardchef


Avatar von Fireball

Registration Date: 11.11.2006
Posts: 16,355
Classing-Rank: GFX-Sector
Location: Bremen, Deutschland
Program: Adobe Photoshop CS2
Deviantart: oenismaster
Forums: (alle)

Spacer
      

Ich habs mal eben auf einfache Weise gemacht.

code: 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
</head>

<body>
<p>Projektfortschritt</p>
<table style="width: 250px; border: 1px solid;">
<tr>
<td style="background-color:#FF0000; width: 25%; text-align:center">25%</td>
<td style="background-color:#FFFFFF;">&nbsp;</td>
</tr>
</table>
</body>
</html>


Ausgabe:

Projektfortschritt

25%  



Ist eigentlich ganz einfach aufgebaut.
Musst du dir halt noch etwas anpassen.

Wenn Fragen sind, fragen Wink


Projektfortschrittsbalken 03.05.2008 23:22 Fireball is offline Homepage of Fireball Search for Posts by Fireball

gesay gesay is a male
Fingerwischer


Avatar von gesay

Registration Date: 02.05.2008
Posts: 26
Location: Gera
Program: Photoshop CS3 Extendet
Deviantart: gesay

Spacer
      

also ich könnte dir was basteln wo du nur die prozentzahl eingibst und dann eben der balken verlängert wird. mit den farben das dürfte auch kein problem sein. falls du das so möchtest setz ich mich mal ran.

e: nagut jetzt gibts nen problem. ich werd mal schaun ob ichs lösen kann

This post has been edited 1 time(s), it was last edited by gesay: 04.05.2008 10:59.
Projektfortschrittsbalken 04.05.2008 00:25 gesay is offline Homepage of gesay Search for Posts by gesay

!RaZo! !RaZo! is a male
Fingerwischer

Spender


Avatar von !RaZo!

Registration Date: 03.03.2008
Posts: 30
Location: Bad Oldesloe
Program: Photoshop CS3

Thread Starter Thread Started by !RaZo!
Spacer
      

Danke Fireball

@gesay
Naja also von grund auf musst du mir das nicht aufbauen, aber trotzdem danke

Nochmal zu deinem Beispiel Fireball, also da ich ja images benutze muss ich ja sicher denn nur backgroundimages benutzen anstatt bg color.
ich hab hier mal ein beispiel gefunden wegen den images

http://www.ulf-theis.de/

Nun nochmal zu meiner Idee jetzt, das kam mir in der Nacht
Wegen dem Farbwechsel wenn zum beispiel 50 % erreicht sind soll die Farbe gelb erscheinen

Das könnte man doch so lösen das der td tag der den balken enthält in eine if schleife packe oder
Sry ich kann es im moment nicht testen.
Deswegen frag ich hier mal
Projektfortschrittsbalken 04.05.2008 12:09 !RaZo! is offline Search for Posts by !RaZo!

Fireball Fireball is a male
Boardchef


Avatar von Fireball

Registration Date: 11.11.2006
Posts: 16,355
Classing-Rank: GFX-Sector
Location: Bremen, Deutschland
Program: Adobe Photoshop CS2
Deviantart: oenismaster
Forums: (alle)

Spacer
      

code: 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:

<p>Projektfortschritt</p>
<table style="width: 250px; border: 1px solid;">
<tr>
<td style="background-image: url(urlzumbild.jpg); width: 25%; text-align:center">25%</td>
<td style="background-color: #FFFFFF; width: 25%;">&nbsp;</td>
<td style="background-color:#FFFF00; width: 50%;">&nbsp;</td>
</tr>
</table>

Ausgabe:

Projektfortschritt

25%    



Sicher nicht die eleganteste Lösung, aber das gewünschte Ergebnis wird erzielt^^
Projektfortschrittsbalken 04.05.2008 13:33 Fireball is offline Homepage of Fireball Search for Posts by Fireball

!RaZo! !RaZo! is a male
Fingerwischer

Spender


Avatar von !RaZo!

Registration Date: 03.03.2008
Posts: 30
Location: Bad Oldesloe
Program: Photoshop CS3

Thread Starter Thread Started by !RaZo!
Spacer
      

So hi nochmal wieder^^
sry das ich mich erst so spät wieder melde

Hier habe ich mein kleines balken script
naja es hat noch tausend fehler, aber wie findet ihr das

Hier

Wie gesagt, es hat noch tausend fehler, nämlich wenn man etwas eingibt und dann die seite neulädt springt er wieder auf 0
Projektfortschrittsbalken 17.05.2008 00:28 !RaZo! is offline Search for Posts by !RaZo!

izak.stern izak.stern is a male
Ohnefiltergrafiker


izak.stern hat kein Avatar

Registration Date: 18.02.2008
Posts: 478

Spacer
      

wir können da morgen ma n bisschen drueber reden / schreiben....

meld dich ma per icq bei mir, dann machen wir des schon, is ja schliesslich wochenende und ich hab atm wieder lust zu coden großes Grinsen

btw is ja logisch, dass der balken wieder bei 0 steht wenn du die seite neu laedst... du musst den stand ja irgendwo zwischenspeichern... entweder in ner textfile oder in ner db...

ausserdem machs doch gleich mit ajax Wink

bis morgen...


This post has been edited 1 time(s), it was last edited by izak.stern: 17.05.2008 00:36.
Projektfortschrittsbalken 17.05.2008 00:33 izak.stern is offline Homepage of izak.stern Search for Posts by izak.stern

!RaZo! !RaZo! is a male
Fingerwischer

Spender


Avatar von !RaZo!

Registration Date: 03.03.2008
Posts: 30
Location: Bad Oldesloe
Program: Photoshop CS3

Thread Starter Thread Started by !RaZo!
Spacer
      

nee ajax ist mir noch etwas zu hoch, einiges schaff ich zwar aber naja ich lern es noch und solange muss php&mysql herhalten

naja das mit der db weiß ich^^
werde ich auch gleich noch machen bzw. nachher Wink

Muss gleich mein wbb3 noch designen
Aber ich meld mich trotzdem mal nachher
Projektfortschrittsbalken 17.05.2008 00:42 !RaZo! is offline Search for Posts by !RaZo!

izak.stern izak.stern is a male
Ohnefiltergrafiker


izak.stern hat kein Avatar

Registration Date: 18.02.2008
Posts: 478

Spacer
      

is doch recht simple...

code: 
1:
2:
3:
4:
5:
6:
7:
8:


var html = $.ajax({   
url: "setvalue.php",   
async: false  
}).responseText;


bis spaeter großes Grinsen

btw entweder VOR oder NACH der bundesliga, danach könnt ich vllt ein wenig mies drauf sein, da der glubb absteigen wird^^
Projektfortschrittsbalken 17.05.2008 01:10 izak.stern is offline Homepage of izak.stern Search for Posts by izak.stern
 
Spacer
   
GFX-Sector
unregistered


hat kein Avatar


Spacer

Have you enjoyed this topic?

If you were enjoying this post and if you keen on reading more interesting stuff then do not hesitate to complete the free sign up.

After the free registration you will gain access to all areas and you will be able to communicate with other artists from all over the world.

In addition you will benefit from our Photoshop and coding section as well as from our huge (hundreds of gigabytes) free resource section where you can find everything you will need to be a successful (web) designer/artist.

Sign up now and enjoy the advantages as a registered member.

(This website will be ad-free after a complete free sign up.)
New Post 17.05.2008 01:10  
Tree Structure | Board Structure
Post New Thread Post Reply
GFX-Sector » Coding Area » Webentwicklung » HTML, CSS » Projektfortschrittsbalken
 
Heutige TOP 10 Suchbegriffe:
Cro Hintergrundbild Cro Cro Wallpaper Cro Hintergrundbilder Sexy Girls Ab 21 Jahren Kukluxklan Marlboro Marlboro Kkk Traumhaft Wallpaper Ku Klux Klan Marlboro
Projektfortschrittsbalken : HTML, CSS (Permalink)
  Sectorbereich   Forenbereich   Battlesection