php-resource



Zurück   PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr > Scripts > BRAINSTORMING PHP/SQL/HTML/JS/CSS
 

Login

 
eingeloggt bleiben
star Jetzt registrieren   star Passwort vergessen
 

 

 


BRAINSTORMING PHP/SQL/HTML/JS/CSS Ihr habt eine Idee, aber keinen genauen Ansatz? Diskutiert mit anderen Usern des Forums über eure Gedankengänge um evtl. hilfreiche Ideen zu bekommen!
Normale Fragen bitte weiterhin in die entsprechenden Foren!

Antwort
 
LinkBack Themen-Optionen Thema bewerten
  #1 (permalink)  
Alt 21-04-2013, 22:16
unikar
 Registrierter Benutzer
Links : Onlinestatus : unikar ist offline
Registriert seit: Apr 2013
Beiträge: 2
unikar befindet sich auf einem aufstrebenden Ast
Lightbulb Interaktiver Raster mit PHP

Hallo,

ich würde gerne in PHP ein Raster zeichnen wie hier:
Zeichnen mit PHP: ein Raster zeichnen | der Blog für Webmaster

Danach soll man mit der Maus eine freie Anzahl von "Pixeln" bzw. Kästchen auswählen können. Die Auswahl soll über die Maus funktionieren wie bei Windows/Mac etc. wenn ich mehrere Ordner oder Dateien auswählen will.

Ist das möglich? Und wenn ja wie?

Vielen Dank!!
Mit Zitat antworten
  #2 (permalink)  
Alt 22-04-2013, 15:59
Melewo
 Registrierter Benutzer
Links : Onlinestatus : Melewo ist offline
Registriert seit: Jan 2013
Beiträge: 365
Melewo befindet sich auf einem aufstrebenden Ast
Standard

Wenn Du mit PHP eine Grafik mit Raster erstellst, dann hast Du ein Bild erstellt, auf dem ein Raster zu sehen. Ein Bild ist ein Bild, ob mit Raster, untergehender Sonne am Horizont oder Blumen oder was es da noch so an malerischen Objekten gibt.

Verweissensitive Grafiken lassen sich mit HTML Image Map erstellen, doch das wird wohl nicht gerade das sein, was Du suchtest. Alles andere dürfte aufwendiger werden.
Mit Zitat antworten
  #3 (permalink)  
Alt 22-04-2013, 22:52
unikar
 Registrierter Benutzer
Links : Onlinestatus : unikar ist offline
Registriert seit: Apr 2013
Beiträge: 2
unikar befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank für deinen Beitrag etwas weitergeholfen hast du mir ja schon. Aber du hast Recht ich suche etwas anderes.. Wie bereits beschrieben möchte ich das man mit der Maus beliebig viele Kästchen auswählen kann.
Mit Zitat antworten
  #4 (permalink)  
Alt 23-04-2013, 12:44
Melewo
 Registrierter Benutzer
Links : Onlinestatus : Melewo ist offline
Registriert seit: Jan 2013
Beiträge: 365
Melewo befindet sich auf einem aufstrebenden Ast
Standard

Dein Vorhaben ließe sich, denke ich zumindest, durch ein Zusammenspiel von HTML, CSS und JavaScript realisieren, bedingt jedoch, dass Du Dich damit bereits gut auskennst.

Dazu würde ich, als ersten Denkansatz, einen großen HTML-Bereich in viele kleinere HTML-Bereiche unterteilen. Ob sich da verschachtelte DIVs besser anbieten als Tabellen, müsste erst getestet werden. Jedenfalls würde ich die Bereiche mit entsprechenden CSS Angaben zur Position versehen werden. Dann die xy-Koordinaten der Maus abgreifen und auswerten. Bei welchen Koordinaten wurde eine Taste gedrückt, bei welchen Koordinaten wurde die Maus losgelassen, dann die Koordinaten mit den Bereichsangaben verrechnen.

Als Einsteiger solltest Du Dir, falls HTML- und CSS-Kenntnisse in ausreichendem Maße vorhanden und von JavaScript zumindest die Syntax bereits sitzt, dafür einige Wochen einplanen. Falls es auf allen 3 Gebieten noch hapert, lieber einige Monate.
Mit Zitat antworten
  #5 (permalink)  
Alt 23-04-2013, 23:04
Guenni61
 Registrierter Benutzer
Links : Onlinestatus : Guenni61 ist offline
Registriert seit: Nov 2011
Ort: Viersen
Beiträge: 128
Guenni61 befindet sich auf einem aufstrebenden Ast
Standard

Hi unikar,

meintest du vielleicht etwas in der Art:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<style type="text/css">
<!-- 
div {
 heigth:200;width:20;
 border: "solid blue";
 border-width:1;
 background-color: "yellow";
} 
-->
</style>
<script type="text/javascript">
<!--
function auswahl(element){
 switch(element.style.backgroundColor){
  case "blue" : element.style.backgroundColor = "yellow";break;
  case "yellow" : element.style.backgroundColor = "blue";break;
  default : element.style.backgroundColor = "blue";
 }
}
// -->
</script>
</head>
<body>
<div onclick="auswahl(this)"></div><div onclick="auswahl(this)"></div>
<div onclick="auswahl(this)"></div><div onclick="auswahl(this)"></div>
</body>
</html>
Komischerweise enthält backgroundColor nach dem ersten Aufruf der Seite keinen Wert (oder mein Fehler). Deshalb der default-Zweig in der Funktion.
Nachdem ein Element einmal angeklickt wurde, kann man zwischen den beiden Farben hin und her switchen.

Um Div-Elemente vernünftig zu positionieren, siehe ==> SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

Gruß
Günni
Mit Zitat antworten
  #6 (permalink)  
Alt 24-04-2013, 10:59
Melewo
 Registrierter Benutzer
Links : Onlinestatus : Melewo ist offline
Registriert seit: Jan 2013
Beiträge: 365
Melewo befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von Guenni61 Beitrag anzeigen
Komischerweise enthält backgroundColor nach dem ersten Aufruf der Seite keinen Wert (oder mein Fehler).
Die Variable element ist bei Seitenaufruf noch undefiniert, bis element durch Aufruf der Funktion durch den ersten Klick einem Element zugeordnet wird. Lässt sich prüfen mit typeof.

HTML-Code:
<script type="text/javascript">

function auswahl(element){

    switch(element.style.backgroundColor){

        case "blue" : element.style.backgroundColor = "yellow";break;
        case "yellow" : element.style.backgroundColor = "blue";break;
        default : element.style.backgroundColor = "blue";
    }
    alert(typeof(element));
}
alert(typeof(element));

</script>
Bei jedem erneuten Klick ändert sich dann der Wert von element durch die Funktion und die Zuordnung durch this.
Mit Zitat antworten
  #7 (permalink)  
Alt 24-04-2013, 23:31
Melewo
 Registrierter Benutzer
Links : Onlinestatus : Melewo ist offline
Registriert seit: Jan 2013
Beiträge: 365
Melewo befindet sich auf einem aufstrebenden Ast
Standard

Habe mal ein einfaches Beispiel gefertigt, ist jedoch nur als Ansatz gedacht. Von Ähnlichkeiten wie beim Ziehen mit der Maus, um in einem Rechteck alle zu öffnenden oder zu löschenden Dateien zu markieren, ist es noch weit entfernt und das ginge nach meinen gegenwärtigen Vorstellungen auch nicht, ohne die Koordinaten zu verrechnen. Doch um eine Auswahl zu treffen, dafür sollte es als Ansatz genügen.

Mit einem Klick in ein Feld wird die Auswahl bei weiterbewegter Maus gestartet, durch einfaches Ziehen mit der Maus können weitere Felder ausgewählt werden, mit einem weiteren Klick wird die Auswahl beendet und mit dem Button kann die Auswahl aufgehoben werden. Für einen Anfang sollte das Beispiel genügen, auch wenn es noch nicht optimal ist.

HTML-Code:
<!DOCTYPE html>
<html>

<head>
<title>Auswahl</title>
<style type="text/css">
body {text-align:center}
.außen {width:328px; margin:auto}
.button{width:328px; margin:auto; clear:both; padding-top:10px}
.innen {text-align:center; float:left; line-height:80px; width:80px;
border:1px solid #ae9230; background-color:#dbcfa5}
</style>
</head>

<body>
<h1>Auswahl</h1>
<div id="außen" class="außen">
    <div id="A01" class="innen">01</div>
    <div id="A02" class="innen">02</div>
    <div id="A03" class="innen">03</div>
    <div id="A04" class="innen">04</div>
    <div id="A05" class="innen">05</div>
    <div id="A06" class="innen">06</div>
    <div id="A07" class="innen">07</div>
    <div id="A08" class="innen">08</div>
    <div id="A09" class="innen">09</div>
    <div id="A10" class="innen">10</div>
    <div id="A11" class="innen">11</div>
    <div id="A12" class="innen">12</div>
</div>
<div class="button">
<input type="button" onclick="hebeauf()" value="Auswahl aufheben">
</div>
<script type="text/javascript">
"use strict";
var start = 0;

document.getElementById("außen").onclick = function() {

    start++;

    if (start % 2 == 0) {

        document.onmousemove = null;
    }
    else {

        document.onmousemove = function(e) {

            if (window.event) {e = window.event;
            }
            if (e.target) {var auswahl = e.target;
            }
            else {auswahl = e.srcElement;
            }
            if (auswahl.id) {

            document.getElementById(auswahl.id).style.backgroundColor = "#40ff40";

            /*-------------------------------------------------------------------
             Hier könnten dann eventuell die restlichen Anweisungen folgen, die
             ausgeführt werden sollen bzw. der Aufruf weiterer Funktionen.
             --------------------------------------------------------------------
            */
            }
        }
    }
}

function hebeauf() {

    var anz = 12 +1;

    for (var i = 1; i < anz; i++) {

        var fid = ((i < 10) ? String("A0" + i) : String("A" + i));
        document.getElementById(fid).style.backgroundColor = "#dbcfa5";
    }
    document.onmousemove = null;
}

</script>
</body>
</html>
Mit Zitat antworten
Antwort

Lesezeichen

Stichworte
php, raster


Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
jQuery - Divs an raster ausrichtbar/verschiebbar oneside Apps und PHP Script Gesuche 1 19-06-2011 11:23
Bilder mit Raster zerschneiden Hoggel Grafik / Design / Flash ... 3 13-09-2006 17:11
Map/Landkarte/Raster wie beim Navi-System. Idee? carapau PHP Developer Forum 7 16-03-2006 16:21
String beschneiden, ich kriege noch en Raster zabarax PHP Developer Forum 7 23-01-2004 09:37
[Script] Raster über einem Bild erstellen JoeMan Apps und PHP Script Gesuche 9 15-09-2003 14:05

Themen-Optionen
Thema bewerten
Thema bewerten:

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an


PHP News

ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlicht
ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlichtDie bekannte Marktplatzsoftware ebiz-trader ist in der Version 7.5.0 veröffentlicht worden.

28.05.2018 | Berni

Wissensbestand in Unternehmen
Wissensbestand in UnternehmenLebenslanges Lernen und Weiterbilden sichert Wissensbestand in Unternehmen

25.05.2018 | Berni


 

Aktuelle PHP Scripte

PHP Server Monitor

PHP Server Monitor ist ein Skript, das prüft, ob Ihre Websites und Server betriebsbereit sind.

11.09.2018 Berni | Kategorie: PHP/ Security
PHP WEB STATISTIK ansehen PHP WEB STATISTIK

Die PHP Web Statistik bietet Ihnen ein einfach zu konfigurierendes Script zur Aufzeichnung und grafischen und textuellen Auswertung der Besuchern Ihrer Webseite. Folgende zeitlichen Module sind verfügbar: Jahr, Monat, Tag, Wochentag, Stunde Folgende son

28.08.2018 phpwebstat | Kategorie: PHP/ Counter
Affilinator - Affilinet XML Produktlisten Skript

Die Affilinator Affilinet XML Edition ist ein vollautomatisches Skript zum einlesen und darstellen der Affili.net (Partnerprogramm Netzwerk) Produktlisten und Produktdaten. Im Grunde gibt der Webmaster seine Affilinet PartnerID ein und hat dann unmittelb

27.08.2018 freefrank@ | Kategorie: PHP/ Partnerprogramme
 Alle PHP Scripte anzeigen

Alle Zeitangaben in WEZ +2. Es ist jetzt 23:04 Uhr.