Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Rysowanie rectangle
rad11
post
Post #1





Grupa: Zarejestrowani
Postów: 1 270
Pomógł: 184
Dołączył: 7.10.2012
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


Panowie mam problem i nie wiem jak go rozwiazac mam nadzieje ze cos podpowiecie:

Mam kontener:
  1. <div id="myCanvas" style="position:relative;height:250px;width:100%;"></div>


i rysuje na nim rectangle:

  1. function drawRectangle(x,y,width,height){
  2.  
  3. var length = $('#myCanvas').children('div').length;
  4.  
  5. $('#myCanvas').append('<div class="rectangle'+length+'" style="border: 3px solid red; top:'+y+'; left:'+x+';position:absolute;"></div>');
  6.  
  7. }
  8.  
  9. var x;
  10. var y;
  11. var width;
  12. var height;
  13. var mouseDownX;
  14. var mouseDownY;
  15.  
  16. $('#myCanvas').on('mousedown', function(e){
  17.  
  18. var offset = $("#myCanvas").offset();
  19. mouseDownX = e.pageX - offset.left;
  20. mouseDownY = e.pageY - offset.top;
  21.  
  22.  
  23.  
  24. $(this).on('mousemove', function(e){
  25. var offset = $("#myCanvas").offset();
  26. var upX = e.pageX - offset.left;
  27. var upY = e.pageY - offset.top;
  28.  
  29. var width = upX - mouseDownX;
  30. var height = upY - mouseDownY;
  31. var length = $('#myCanvas').children('div').length;
  32.  
  33.  
  34.  
  35. $('.rectangle').css({
  36. width: width,
  37. height: height
  38. });
  39. });
  40. drawRectangle(mouseDownX, mouseDownY);
  41.  
  42. });
  43.  
  44.  
  45. $('#myCanvas').on('mouseup', function(e){
  46. $('#myCanvas').unbind('mousemove');
  47. });


Nie wiem jak rozwiazac aby dodanie css dotyczylo aktualnie rysowanego rectangla jakies pomysly?
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 21.08.2025 - 19:01