Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.03.2017, 22:47
Новичок на форуме
Отправить личное сообщение для aslan2030 Посмотреть профиль Найти все сообщения от aslan2030
 
Регистрация: 28.02.2017
Сообщений: 6

Как сделать ограничение на количество элементов в блоке с .droppable
Как сделать ограничение на количество элементов в блоке с .droppable

Вот файл:
Вложения:
Тип файла: zip webapplication.zip (903.1 Кб, 5 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 05.03.2017, 03:03
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

aslan2030, блоки аксессуаров нельзя скрывать, иначе надо делать копии картинок и алгоритм будет иной, перетащить одну картинку из блока на фото, кнопкой плюс увеличить, добавить из другого блока, для смены переместить картинку за пределы фото и выбрать другую. заменить полностью код ниже.
$(document).ready(function(){
    //МЕНЮ ВЫБОРА
    var a = $(".nav a"), d = $(".submenu").show();

    //МЕНЮ ВЫБОРА
    
    
    //ЗАГРУЗКА КАРТИНКИ
    
    var drop = $(".drop"), maxSize = 3000000; //300 Kb
    //проверка drag'n drop
    if (typeof(window.FileReader) == 'undefined') {
        drop.text('Не поддерживается браузером!');
        drop.addClass('error');
    }
    //проверка drag'n drop
    
    
    drop[0].ondragover = function(){
        drop.addClass("hover");
        return false;
    }
    
    drop[0].ondragleave = function(){
        drop.removeClass("hover");
        return false;
    }
    
    drop[0].ondrop = function(event) {
        event.preventDefault();
        drop.removeClass('hover');
        drop.addClass('ondrop');
        
        var file = event.dataTransfer.files[0];
        
        
        if (file.size > maxSize) {
            drop.text('Файл слишком большой!');
            drop.addClass('error');
            return false;
        }else if(file.type != "image/jpeg"){
            alert("only jpeg or jpg !!!");
            drop.removeClass("ondrop");
        }else{
//            $.ajax({
//                url: "getImg.php",
//                data: file,
//                success: function(file){
//                    imgField.html(file);
//                }
//            })
        }
    };
    //ЗАГРУЗКА КАРТИНКИ  
    
    //ВЫБОР АКСЕССУАРА 
    // Переменные
    var acs = $(".accessories"),
        imgField = $("#image"),
        plus = $("#plus"),
        minus = $("#minus"),
        acsW = acs.width(),
        acsH = acs.height();

    acs.draggable({
        zIndex: 100
    });
 var temp = acs.eq(0);
  plus.on("click", function() {
  var w = $(temp).width();
  $(temp).width(w+30);
})

 $(".picture").droppable({
    drop: function(event, ui) {
        var imgs = $(ui.draggable).siblings();
        var revert = imgs.filter(".in").length > 0;
        if (revert) {$(ui.draggable).not(".in").removeClass("in").draggable("option", "revert", true);}
        else {temp = ui.draggable;$(ui.draggable).addClass("in").draggable("option", "revert", "invalid") };
    },
    out: function(event, ui) {
        $(ui.draggable).removeClass("in").width(120).draggable("option", "revert", true);
        $(ui.draggable).data("uiDraggable").originalPosition = {
            top: 0,
            left: 0
        };
        var imgs = $(ui.draggable).siblings();
        var revert = imgs.filter(".in").length < 1;
        if (revert) imgs.not(".in").draggable("option", "revert", "invalid")
    }
});

    
})
Ответить с цитированием
  #3 (permalink)  
Старый 10.03.2017, 17:41
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

aslan2030, вот здесь сделано почти как я написал, тебе остается только нативный d&d добавить.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать поворот DIV клонов alexgrenn Элементы интерфейса 4 18.04.2016 21:58
Как сделать что бы картинки с другого url отображались как свои zlodey Серверные языки и технологии 1 04.05.2015 21:30
Как вывести количество скачиваний? ФаргатЪ Общие вопросы Javascript 0 28.03.2015 08:09
Как на jquery сделать выборку элементов несодержащи в в себе определённые теги рони jQuery 7 11.02.2013 05:06
Как сделать, чтобы при наведении на кнопку справа от нее появлялись текстовые ссылки? Tass Общие вопросы Javascript 7 17.02.2011 09:06