Keresés

Időközben megírtam canvas-al. Megy is. (köszönöm a segítséget)

Viszont evés közben jön meg az étvágy...

Arra szeretnék ötleteket kérni, hogy a kép egy részének másolását beillesztését hogyan tudnám megldani. Tehát kijelölöm, kimásolom (ez szerintem megy önállóan). Tehát abban kérnék segítséget, hogy például kövesse az egérkurzort a képrész (pl. hgyan hozok létre egy képet a memóriában, stb.), vagy "beillesztés" után hogy tudom a megfelelő helyre mozgatni...

Ok, vágom ...

Ha csinálok egy 100x100-as üres táblázatot, azt megcsinálja átlag 1,2 másodperc alatt. Ha a0.gif-ekkel kitöltött cellákat (8x8-as méretű képkockák), akkor úgy 5,9 másodpercbe telik.

Táblázatnál betöltéskor egyetlen képet nyit csak meg, és tesz ki, minden cellába az kerül. S mivel a böngésző úgyis gyorsítótárazza csak egyszer nyitja meg, illetve tölti le.

Azt az ötletet hogy a cellákra keretet állítsak be elvetettem, ugyanis szebben néz ki ha képpel készítem amikor ezt a keret részt kell változtatni (mármint 1-1 kiválasztott cellánál).

Időközben kipróbáltam nem annyira a JS visz el sok időt, hanem maga a táblázat elkészítése.

A canvas megoldásra még nem volt időm, illetve kicsit tanulnom is kell hozzá (hogy értsem is mit csinál).

Ha viszont táblázatos megoldást használnál (ha fontos a négyzetrács), akkor sem kéne képeket betölteni, hanem egyszerűen a cella háttérszínét beállítani. Így nem kell 10ezer darab fájlot megnyitni. Szerintem az telik iszonyúan sok időbe.

Igen, jól látod a program lényegét.

Igen, utána egy php létrehozza a tényleges képe(ke)t, illetve van visszalépésre lehetőség (betölti az aktuális mintát javításhoz).

Az "akár többször is" arra vonatkozott, hogy egymás után több cellába is leteheti. Feljetsd el, egy sima rajzolóprogram.

Igen, ez a canvas teljesen megfelel, de akkor meg fogom hagyni a régi verziót is. Egy módosított verzió felkerül majd a netre, de jelenleg itthonra kell.

Köszönöm a segítséget.

Szóval ez egy rajzolóprogram akar lenni, ahol képpontonként kell megrajzolni a képet, amit aztán a php-nek elküdve menti azt. De mi az, hogy a kiválasztott színt a megfelelő helyre AKÁR TÖBBSZÖR IS? Azért azt vedd figyelembe, hogy canvas a HTML 4-ben még nem volt!

Betöltődéskor (alap esetben) egyetlen képet tölt be. Mondjuk azt tízezerszer.

A kép kis méretű gif (13*13 képpont, fehér alap szürke kerettel)

Gyakorlatilag egy négyzetrácsot hoz létre (a'la kockás papír), amire a kiválasztott színnel lehet kitöteni a mezőket, illetve rátenni különböző mintákat.

Tehát kiválasztom a kívánt színt vagy mintát, és azt teszi a megfelő helyre akár többször is. Az adatokat ezután elküldi egy php-nek, ami a tényleges képet elkészíti.

Ennek a canvas-nak utánaolvasok, köszönöm.

Az tény, hogy egyszerűbb leírni a document.getElementById( "akarmi" ) helyett annyit, hogy $( "akarmi" ). És vannak praktikus dolgok benne, de a képlapozás mittudomén milyen áttűnéssel etc. az már csak egy látványelem.

Ez nagyon gáz. Nem tudom, mit csinál, de 10ezer darab képet (fájlot) mennyi idő alatt akarsz megnyitni? Nekem csak az a gáz benne, hogy 10ezer darab kép kerül egy oldalra.

Ezek milyen képek akarnak lenni? Mit ábrázolnak?

Mi lenne, ha ezt canvas használatával oldanád meg?

Vagy esetleg egyszerűen háttérszínt adnál a celláknak?

Sziasztok!

Egy kis scriptet írtam (elsősorban) magamnak, működik is, csak rettenetesen lassú a betöltése.

A cél az lenne, hogy egy négyzetrácson kiválasztott színnel tudjak "rajzolni". A dolgot bonyolítja, hogy nem csupán egyetlen színt kell megjeleníteni, hanem azon különböző alakzatokat is. Ezeket átlátszó képekkel táblázatos formában írtam meg.

var szeles= 100
var magas = 100
var current = '2'
var cella = new Array(magas)
var a_t=new Array(magas);
var b_t=new Array(magas);
 
function tablarajzol()
{
    var x;
    var y;
    for (x = 0; x <= szeles; ++x)
    {
        var tablasora = new Array(magas);
        a_t [x] = tablasora
        var tablasorb = new Array(magas);
        b_t [x] = tablasorb
    }
 
    for (x = 0;  x <= magas; ++x)
    {
        document.write('<tr >')
        for (y = 0;  y <= szeles; y++)
        {
            a_t [x] [y] = 0
            b_t [x] [y] = 0
            // document.write('a'+a_t[x][y]+'-'+b_t[x][y]+'.gif')
            document.write('<td><img src=a0.gif')
            document.write(' onmousedown=tablarairas(' + x + ',' + y + ')')
            document.write(' name="x' + x + 'y' + y + '" ></td>')
        }
        document.write('</tr>')
    }
}

//// Táblára írás kiválasztott színnel
function tablarairas(x,y)
{
 
//// var y;
 
var i;
var j;
var d="";
 
    if (current<=260 && current>=253)
    {
        //b_t[x][y]=0
        //current=current-253
        a_t[x][y]=current-253
        document.images["x" + x + "y" + y].src ='b'+a_t[x][y]+'.gif'
    }
 
    else if (current<=252 && current>=1)
    {
        //a_t[x][y]=0
        b_t[x][y]=current
        document.images["x" + x + "y" + y].src ='a'+a_t[x][y]+'-'+b_t[x][y]+'.gif'
    }
}

function valaszt(z)
{
  current = z
  document.valasztott.src = 'a' + current + '.gif'
  //document.nagy.src = 'c' + current + '.gif'
   
    if (current<=260 && current>=253)
    {
        a=current-253
        document.valasztott.src = 'b' + a + '.gif'
    }
    else  
    {
        document.valasztott.src = 'a' + current + '.gif'
    }
}

A kérdésem az lenne, hogy lehet-e ezt gyorsabb formában?

Mármint nem ragaszkodom a táblázathoz ha máshogy gyorsabb, illetve a képek sem lényegesek ha gyorsabb kirajzolni (csak egyenes vonalak vannak).

Nem értek a JS-hez, így a javaslatokhoz legalább kulcsszavakat is kérnék hogy mit keressek.

Előre is köszönöm a segítséget.

Nem tudom, hogy ez a script mit csinál, de annak, amit leírtál, nem kéne ilyen bonyolultnak lenni.

Esetleg leírnád egzaktabbul, hogy mi a feladat?

Sziasztok!

Van egy script-em, de nem működik megfelelően..
A lényege az lenne, hogy 3 checkbox-ból 1 választhat csak ki a felhasználó, valamint addig ne jelenjen meg a következő gomb amin nem választott...
nos addig eljutottam hogy csak egyet választhat ki az delikvens.
Ami nem működik az pedig a következő "next" bottom .
Valakinek van ötlete?

A kód:

$ks_query = dbquery("select * from ( select * from ".DB_KVIZ." order by `kv_ID` desc limit 20
) as lastest_results order by rand() limit 5;");
$i = 1;
while ($sor = dbarray($ks_query)){ 
   echo '<div class="page">';
   echo '<h2>
     <strong>'.$sor['kv_text'].'</strong><br><em>Válaszd ki a helyes választ a felsorolásból!</em></h2>
    </h2>';
   //echo "<h2 align='center'> ".$sor['kv_text']." </h2>";
      $kerdez = $sor['kv_ID'];
      $kv_query = dbquery("SELECT * FROM ".DB_KVIZ_V." WHERE v_kv_ID = ".$kerdez."  ");
      echo "<ul>";
      echo '<input type="hidden" value="'.$kerdez.'" name="kerdes" />';
      $is = 1;
      while ($va = dbarray($kv_query)) {
      echo '<li><label><strong>
      <input id="transcheck'.$is.'" onclick="enabledisablenext()" type="checkbox" value="'.$va['v_ID'].'"  name="valasz['.$i.'][]" /> '.$va['v_text'].' </strong>
      </label></li>';
      $is++;
      }
      if($i == 5){
      echo '<li class="clearfix">
      </li></ul>
      <p style="margin-top:30px; text-align:right;">
      <button disabled="disabled" id="next"  type="submit" class="submit">Submit &raquo;</button></p>';
   }
   else { echo '<li class="clearfix">
      <button  disabled="disabled" id="next" type="button" class="next right">Continue &raquo;</button></li></ul>'; }
      echo "</div>";
      $i++;
   }

echo '</div></div></form>';

echo '<script>
$(function() {
var root = $("#wizard").scrollable();
var api = root.scrollable(), drawer = $("#drawer");
api.onBeforeSeek(function(event, i) {
if (api.getIndex() < i) {
 var page = root.find(".page").eq(api.getIndex()),
   inputs = page.find(".required :input").removeClass("error"),
   empty = inputs.filter(function() {
   return $(this).val().replace(/s*/g, '') == '';
   });
 if (empty.length) {
  drawer.slideDown(function()  {
   drawer.css("backgroundColor", "#229");
   setTimeout(function() { drawer.css("backgroundColor", "#fff"); }, 1000);
  });
  empty.addClass("error");
  return false;
 } else {
  drawer.slideUp();
 }
}
$("#status li").removeClass("active").eq(i).addClass("active");
});
root.find("button.next").keydown(function(e) {
if (e.keyCode == 9) {
 api.next();
 e.preventDefault();
}
});

$("input:checkbox").click(function() {
    if ($(this).attr("checked") === true) {
        var group = "input:checkbox[name='" + $(this).attr("name") + "']";
        $(group).attr("checked", false);
        $(this).attr("checked", true);
    } else {
        $(this).attr("checked", false);
    }
   });
});

$("input:checkbox").click(function enabledisablenext(){
    var boxeschecked = 0;
    for (var i = 0; i<= 3; i++) {
        if(document.getElementById("transcheck" + i).checked == true){ 
        boxeschecked ++;
        }
    }
    if (boxeschecked == 0) {document.getElementById("next").disabled= true;}
    if (boxeschecked != 0) {document.getElementById("next").disabled= false;}
});
</script>';

Én is iframe-re gondoltam, vagy másik ablak is jó.

Rendben, köszönöm az eddigi segítséget is, már sokat tanultam belőle :D

Halovány elképzeléseim vannak csak a frame-es megoldásról, de aszerint is úgy látom, hogy az ajax-szal célszerűbb lenne. Hovatovább bookmarklet helyett Greasemonkey script, de ne szaladjunk ennyire előre. Egy szó mint száz, megéri ajax-szal csinálni, mert úgy nem jönnek elő ablakok, hanem csak a háttérben "klikkelget". Ha mázlid van, használnak jQueryt azon az oldalon és úgy még egyszerűbb dolgod van. Szóval megéri megtanulni az ajaxot, az az ismeret pedig ami neked kell, legrosszabb esetben is pár óra tanulással elérhető.

Áh...most már világos, a location.href helyett betettem a window.open parancsot és ezzel működik, meghívja ahányszor kell, csak másik ablakban, mondjuk ez nem gond, csak működjön :D

Mint már írtam még kezdő vagyok a javascript terén, még weboldalt sem írtam, csak egyszerűbb html parancsokat tudok (háttér színezés, szövegek megjelenítése esetleg képek, ennyi...).

A frame-el, hogy lehet megoldani vagy az ajax-al? Azt a játék oldalt nem én írtam így módosítani nem tudok rajta, csak scripteket futtatni bookmark-ból :)

Köszönöm mindkettőtöknek :D

Látom nem érted. A location.href-fel elmész arról az oldalról, amin a scriptedet elindítottad, így megáll a futása és jó hogy nem hívódik meg többször a függvényed. Ezt írta szjozsi79 is. Lehetséges megoldás lehet még egy iframe, vagy popup, vagy szerintem sokkal inkább az ajax.

Vagy töltsd inkább egy frémbe, amit akarsz frissíteni, de az a document, ami a scriptet tartalmazza, mindig maradjon meg!

Kipróbáltam, és az alert-el működik, megadott indönként megjelenik az az ablak, de ha a location.href-et adom meg akkor már csak egyszer fut le. Úgy is próbáltam, hogy a location.href utáni sorba betettem az alert-et is, de ekkor is csak egyszerfut le....

Bookmarklet-ként használom, egy játéknál kellene, hogy ne kelljen sokszor én klikkelgessek egy linkre, inkább scriptel szeretném megoldani, és a klikkelés helyett gondoltam beírom a location.href -hez annak a szövegnek a linkjét amire kellene kattintsak, de lehet hogy valamit nem jol csinálok, mert nem akar összejönni...

jelenleg ennyi a program de nem fut le csak egyszer:

javascript:
var i=0;
var out;
function func()
{
  var link = 'a_szoveg_linkje';
  window.location.href = link;
  alert("hello");
  out = window.setTimeout(function(){func();},2000);
  i++;
  if(i==10) clearTimeout(out);
}
func();

azt a változót csak azért tettem be, hogy ne a végtelenségig jelenjen meg az a felugró ablak.

próbáltam window.location.href-el is de így sem megy, ha az a sor kiveszem, csak az alert-et hagyom akkor szépen működik :)

Nem teljesen értem mire gondolsz, de szerintem a probléma a location.href bolygatásával van. Nem tudom az általad megírt szkript hogy töltődik be (bookmarklet, greasemonkey, stb) de mivel ezzel a location.href-fel egy új oldal betöltését idézed elő, ezért nagy valószínűséggel a te szkripted ott már nem töldődik be, ezért nem is tud lefutni. Próbáld ki mondjuk a location.href átírása helyett mondjuk egy alert() hívással. Ezzel X időközönként kapsz egy kis ablakot egy OK gombbal.

Köszönöm a választ, de így sem működik, csak egyszer hajtódik végre és utána többet nem. Ez egy online játékhoz kellene, mivel ott engedélyezett a scriptek használata, s így a böngészőben beteszek egy könyvjelzőt és annál az elérési helynek (location) bemásolom ezt a scriptet, de amikor rákattintok csak egyszer hajtja végre...

Ennél a megoldásnál másképp kell írni a scripteket? Még kezdő vagyok a javascripttel, most ismerkedek vele, ezért nem tudom, mit kellene másképp csináljak.

Egy linkre kellene kattintgatni sokszor és ezzel a játék számolgat valamiket (érméket gyüjtöget), de mivel nincs időm egész nap ezt csinálni, gondoltam meg lehetne oldani egy scripttel, mert az úgy is engedélyezett.

Példák alapján írtam meg ezt az egyszerű kis programot, de úgy látszik valami még sem jó.

Mi történik a programmal miközben megy az időzítés a setTimeout függvénnyel? Megáll ott és várakozik vagy végrehajtja a soron következő utasításokat és mintegy megszakításként hajtja végre a paraméterként megadott függvényt? Hogyan lehetne ezt pl egy for ciklusban alkalmazni?

Szerintem a 'hosszan' és a 'röviden' leírt specifikáció sem egymással, sem a programrészlettel nincs összhangban.

Próbáld ki így is:   setTimeout (function(){func();},5000);

Sziasztok, az lenne a kérdésem, hogy javascriptben, hogy lehet megoldani azt, hogy bizonyos időközönként (pl 5 másodpercenként) megnyisson egy új linket ugyanabban az ablakban.

Röviden, a weboldalon van egy link amire rákattintva elvégződnek valamilyen műveletek és megjelenik egy popup ablak és majd eltűnik.

Ezt szeretném megoldani scriptben.

Próbáltam a következőt de nem működik:

javascript:
function func()
{
  var link = 'az_a_bizonyos_link';

  location.href = link;
  window.setTimeout(func,5000);
}
func();

Egyszer végrehajtódik és utána semmi...

Előre is köszönöm!

"rugalmas" weblap-ot csinálni, azért lehet másképp is. Ha a stílusokban nem fix méreteket használsz mondjuk, hanem %-osakat. Persze nagyon nem könnyű így se egy jó oldalt megcsinálni, főleg ha most ismerkedsz vele, de tanulni sosem árt :)

Adok egy tippet, ez a függvény a lap méretét állítja be, a body onload eseményénél hívódik. Itt két hasábot is (szoveg, menu) méretez, de bármi hasonlóan kezelhető.

function meretez()

{
docend = document.getElementById('pagebottom');
if (docend=='undefined') return false;
docheight = docend.offsetTop;
if (docheight < 640) docheight = 640;
parent.document.getElementById('szoveg').style.height = docheight;
parent.document.getElementById('menu').style.height = docheight + 145;
}

Igazából rugalmas weblapot akartam készíteni, abban a témában találtam a media query-t, ott pedig, hogy IE6-8 nem kezeli, ezért gondoltam, hogy javascripttel lekérdezem az oldal méretét és azok alapján irányítom a megfelelő css beállításokhoz és laikus kezdőként nem értettem, hogy miért nem tudom kiolvasni az adatot, ha módosítani igen. Köszönöm a választ, nem mondom, hogy értem amit írsz, de azt igen (ezzel szembesülök minden nap), hogy egyre többet olvasok és egyre kevesebbet tudok. :( Természetesen utánanézek a linknek, de sajnos lassan haladok, mert eléggé töröm az angolt. Namind1, előbb-utóbb csak meglátom a fényt az alagút végén. :)

Mert a .style az az element style propertie-re vonatkozik, nem tartozik bele a css-ből ráhúzott, csak az inline style paramétert kezeli. Itt találsz egy jó leírást, hogyan kezeld js-ből: http://www.quirksmode.org/dom/getstyles.html Bár, mint itt többször is elhangzott, hacsak nem tanulási célzattal js-ezel, akkor viszont illene keresni tudnod a neten a problémák után, akkor inkább használj valami lib-et, ezek elfedérésre (lásd jquery stb stb)

Sziasztok!

Kezdő vagyok a témában. Nem értem, hogy miért nem írja ki a háttér színét, csak egy üres alert ablakot kapok. Alapban css-el már megadtam a színét, tehát lenne mit kiírnia. Ha a megjegyzés részt kóddá alakítom (kiveszem a "//"-et), akkor meg kiírja.  Ugynez a jelenség style.width-nél is.

Miért nem működik?

<!DOCTYPE html>
<html>
<head>

<style>
#egy{
width:400px;
height:400px;
background-color:yellow;
}
</style>

<script>
function szinezo(){
//document.getElementById("egy").style.backgroundColor="green";
alert(document.getElementById("egy").style.backgroundColor);
}
</script>
</head>

<body onload="szinezo()">

<div id="egy"></div>

</body>
</html>

Egyébként

setInterval(function(){ reUpdate(); } , 1100 );

helyett jó az 

setInterval(reUpdate , 1100 );

formában is.

Hogy nem vettem észre egy alig 400 soros programban egy kisbetű-nagybetű eltérést?