Cómo configurar un elemento arrastrable en las páginas de un libro animado

Estoy trabajando con un flipbook dinámico de jquery. Puedo agregar notas post-it a cualquier página, ya sea par o impar. Este código crea las notas, selecciona a qué página agregar la nota y arrastra.

function CreatePostIt() {
                    $("#PostIt").dialog({ modal: true, autoResize: true, height: 500, width: 530,
                        open: function () {

                            $("#BookMenu").fadeOut(500);
                            BookMenuShow = false;
                            $("#pNotes").addClass("yellow");
                            $("#pNotes").removeClass("transparent");
                            $("#pNotes").removeClass("blue");
                            $("#pNotes").removeClass("green");
                            $("#note-body").text("");
                            $("#pNotes").css("font-size", $("#NoteFontSize").val());
                            color = "yellow";
                            $("#pNotes").text("");
                            if (PageIndex == 0) {
                                $("#rightTn").click();

                                $("#leftTn").attr("src", "images/blank.gif")

                                $("#rightTn").attr("src", tnNames[PageIndex]);

                            } else {
                                $("#leftTn").width(120);
                                $("#rightTn").width(120);
                                $("#leftTn").attr("src", tnNames[PageIndex - 1])
                                $("#rightTn").attr("src", tnNames[PageIndex]);
                                $("#leftTn").click();
                            }

                        },
                        buttons: {
                            "INSERT": function () {

                                var count = $(".npg" + PageSelected).length;

                                var Annotation = $("<div style='z-index:250000' class='note npg" + PageSelected + "' index='0'></div>");
                                var aId = "Page-" + PageSelected + "-Note-" + (count + 1);
                                AnnoCount = AnnoCount + 1;
                                $(Annotation).attr("id", "Page-" + PageSelected + "-Note-" + (count + 1));
                                $(Annotation).css("font-size", $("#NoteFontSize").val());
                                $(Annotation).css("display", "none");
                                $(Annotation).append("<img class='noteClose'  rel='Page-" + PageSelected + "-Note-" + (count + 1) + "' style='float:right; padding:10px 10px 5px 5px' src='images/close.gif'/>");
                                $(Annotation).append("<div style='padding:25px 25px 25px 25px;' id='noteText" + (count + 1) + "' class='noteBody'>" + $("#note-body").val() + " </div>")
                                $(Annotation).addClass("liveNote");
                                $(Annotation).addClass("npage" + PageSelected);
                                $(Annotation).addClass(color);
                                $("#pgDv" + (PageSelected)).prepend(Annotation);
                                $.cookie("Book-" + bookid + "-Page-" + PageSelected, aId + "||" + $("#note-body").val() + "||" + "0,0,0,0||" + color + "||" + $("#NoteFontSize").val() + "<*>", { expires: 365, path: "/" });

                                **if (ZoomOn != true) {
                                    if ("#rightPageShadow") {
                                   Annotation.draggable({ cusror: "pointer", containment: 'parent'                                  
                                           });
                               } else {
                                   Annotation.draggable({ cusror: "pointer", containment: "#leftPageShadow"
                                   });
                               }
                                }
                                else if (ZoomOn = true) {
                                    Annotation.draggable({
                                        create: function () {
                                            $(this).show();
                                        },
                                        cusror: "pointer",
                                        containment: "parent"
                                    });
                                }
                                $(Annotation).show();
                                //   $("#PostItNoteInd").show();
                                $(this).dialog("close");
                                $("#note-body").text("");**
                            }
                   , "CANCEL": function () {
                       $("#pNotes").text("");
                       $("#leftTn").attr("rel", -10);
                       $("#leftTn").css("border", "0px solid red");
                       $("#rightTn").attr("rel", -10);
                       $("#rightTn").css("border", "0px solid red");
                       $(this).dialog("close");
                   }
                        }
                    });
                    var cw = $("#PostItDialogContent").width();
                    $("#PostIt").dialog("option", "width", cw + 20);

                }

el problema que tengo es cuando la nota de publicación se coloca en la página de la izquierda y en la parte superior funciona. pero a la derecha y abajo no. Probé [x,y, x1, y1] pero debido a que cada libro es diferente, traté de usar mis etiquetas de identificación si #leftPageShadow con está en div y otro es #rightPageShadow

preguntado el 27 de julio de 12 a las 22:07

1 Respuestas

Problema solucionado Estaba perdiendo el código de cookie de cambio de identificación de cookie.

Respondido 28 ago 12, 20:08

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.