Javascript.RU

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

Вместо наведения мыши, нужен клик
Здравствуйте. Совершенно не разбираюсь в jquery, но встала задача изменить скрипт, чтоб щелчек вызывал меню, а не наведение мыши. 2 дня разбираюсь, а понять не могу. Сел за учебники, но когда я дойду до такого уровня... А надо сделать. Как я понял, это скрипт. т.к. я mouseenter меняю на click и срабатывает и наведение и клик. Надо оставить только клик. Если еще и разъясните, что и зачем поменяли, то с меня печенька Вот скрипт:

Warp.Menu = new Class({
	
	initialize: function(element, options) {
		this.setOptions({
			mode: 'default',
			itemSelector: 'li',
			dropdownSelector: 'ul',
			duration: 600,
			remainTime: 800,
			remainClass: 'remain',
            firstLevelSelector: 'li.level1',
			transition: Fx.Transitions.linear,
			wait: false
		}, options);

		var obj = this;

		this.menu = $(element);
		this.timer = null;
		this.hovered = null;
		this.dropdowns = [];
		this.remain = [];
		
		if (!this.menu) return;
		
        this.firstLevelItems = this.menu.getElements(this.options.firstLevelSelector);
        
		this.menu.addEvents({
			mouseenter: function(event) {	
				obj.remain = [];
				obj.removeRemain(10,true);
			},
			mouseleave: function(event) {
				obj.remain.each(function(item) {
					item.addClass(obj.options.remainClass);
				});
				obj.removeRemain(obj.options.remainTime);
                
                if(!obj.menu.getElement("li."+obj.options.remainClass)){
                    obj.fireMenuEvent('menu:leave');
                }
			}
		});
        

        this.firstLevelItems.addEvent("mouseenter", function(){
            if(!this.hasClass(obj.options.remainClass)){
				obj.fireMenuEvent('menu:leave');
				obj.fireMenuEvent('menu:enter', this);
			}
        });
        
		
		this.menu.getElements(this.options.itemSelector).each(function(item) {
			var dropdown = item.getElement(this.options.dropdownSelector);
            
			if (dropdown) {
				this.dropdowns.include(item);
				
				if (this.options.mode == 'slide') {
					this.attachSlideFx(item, dropdown);
				} else {
					this.attachDefaultFx(item, dropdown);
				}
				
				item.addEvents({
					mouseenter: function(event) {
						item._dropdownhover = true;
						obj.remain = [];
                        
						if (!item.hasClass(obj.options.remainClass) && !window.opera) {
							item.fireEvent('fx:dropdown');
						}
					},
					mouseleave: function(event) {
						item._dropdownhover = false;
						if (obj.menu != event.relatedTarget && !obj.menu.hasChild(event.relatedTarget)) {
							obj.remain.include(item);
						}
					}
				});
			}
			  
		}.bind(this));        
        
        if(this.options['fancy'] && Warp['FancyMenu']) {
            new Warp.FancyMenu(this.menu, $extend({hoverClass: obj.options.hoverClass}, obj.options.fancy));
        }
        
	},
    
    fireMenuEvent: function(event, item){
        
        if(event=='menu:leave'){
            if(!this.hovered) return;
            item = this.hovered;
        }else{
            this.hovered = item;
        }
        
        var index = 0;
        for(var i=0;i < this.firstLevelItems.length;i++){
            if(item==this.firstLevelItems[i]){
                index = i;
                break;
            }
        }
        
        this.menu.fireEvent(event, [item,index]);        
    },

	attachDefaultFx: function(item, dropdown) {
		
		var styles = dropdown.getStyles('width','height','opacity');
		var reset = {'width': 0, 'height': 0};
		var div = new Element('div').adopt(dropdown.getChildren()).injectInside(dropdown).setStyle('width', styles.width.toInt());
		var fx = new Fx.Styles(dropdown, this.options);

		switch(this.options.mode) {
			case 'width':
				reset = {'width': 0};
		  		break;    
			case 'height':
				reset = {'height': 0};
				break;
		}		
		
		item.addEvent('fx:dropdown', function() {
			fx.stop();
			fx.element.setStyles($extend(reset, window.ie ? {'overflow': 'hidden'} : {'opacity': 0, 'overflow': 'hidden'}));
			fx.start(styles).chain(function(){
				fx.element.setStyles(styles);
			});
		});

	},

	attachSlideFx: function(item, dropdown) {

		var styles = dropdown.getStyles('width','height','opacity');
		var div = new Element('div').adopt(dropdown.getChildren()).injectInside(dropdown);
		var fx1 = new Fx.Styles(dropdown, this.options);
		var fx2 = new Fx.Styles(div, this.options);

		item.addEvent('fx:dropdown', function() {
			fx1.stop();
			fx1.element.setStyles({'height': 0, 'overflow': 'hidden'});
			fx1.start(styles).chain(function(){
				fx1.element.setStyles(styles);
			});

			fx2.stop();
			fx2.element.setStyles({'margin-top': - styles.height.toInt()});
			fx2.start({'margin-top': 0});
		});

	},
	
	removeRemain: function(delaytime,mousenter) {
		$clear(this.timer);
		this.timer = (function(){
			this.dropdowns.each(function(item) {
				if (item.hasClass(this.options.remainClass) && !item._dropdownhover){
                    if(!mousenter){
                        if(!mousenter) this.fireMenuEvent('menu:leave');
                    }
				}
                item.removeClass(this.options.remainClass);
			}.bind(this));
		}).delay(delaytime, this);
	},

	matchHeight: function() {
		if (this.menu) {
			this.menu.getElements('li.level2 div.sub').each(function(sub) {
				var hover = sub.getParent().getElement('div.hover-box4');
				var height = Math.max(sub.getCoordinates().height, hover.getCoordinates().height);
				var elements = [sub, hover];

				elements.each(function(element) {
					var offset = element.getStyle('padding-top').toInt() + element.getStyle('padding-bottom').toInt() + element.getStyle('border-top-width').toInt() + element.getStyle('border-bottom-width').toInt();
					element.setStyle('height', height - offset);
				});
			});
		}
	},

	matchUlHeight: function() {
		if (this.menu) {
			this.menu.getElements('div.dropdown-3').each(function(div) {
				var elements = div.getChildren();
				var height = 0;

				elements.each(function(element) {
					height = Math.max(element.getCoordinates().height, height);
				});
				
				elements.each(function(element) {
					var offset = element.getStyle('padding-top').toInt() + element.getStyle('padding-bottom').toInt() + element.getStyle('border-top-width').toInt() + element.getStyle('border-bottom-width').toInt();
					element.setStyle('height', height - offset);
				});
			});
		}
	}
});

Warp.Menu.implement(new Events, new Options);
Ответить с цитированием
  #2 (permalink)  
Старый 21.10.2011, 15:48
Аватар для Serg_pnz
Сам по себе
Отправить личное сообщение для Serg_pnz Посмотреть профиль Найти все сообщения от Serg_pnz
 
Регистрация: 09.06.2009
Сообщений: 963

Я вас сильно огорчу, если скажу, что код на mootools? )))
Ответить с цитированием
  #3 (permalink)  
Старый 21.10.2011, 16:13
Новичок на форуме
Отправить личное сообщение для Jaroslav Посмотреть профиль Найти все сообщения от Jaroslav
 
Регистрация: 21.10.2011
Сообщений: 3

Не огорчите))) Но смысл остается, что надо сделать клик)

Придется другие мануалы доставать!))
Ответить с цитированием
  #4 (permalink)  
Старый 21.10.2011, 17:57
Аватар для Serg_pnz
Сам по себе
Отправить личное сообщение для Serg_pnz Посмотреть профиль Найти все сообщения от Serg_pnz
 
Регистрация: 09.06.2009
Сообщений: 963

Сразу не сшурупил попросить: покажите сайт в инете, если есть. Или сохраните страницу как хтмл - охота покопаться - давно не брал в руки шашек...
Ответить с цитированием
  #5 (permalink)  
Старый 24.10.2011, 09:50
Новичок на форуме
Отправить личное сообщение для Jaroslav Посмотреть профиль Найти все сообщения от Jaroslav
 
Регистрация: 21.10.2011
Сообщений: 3

www.eurogalant.ru-этот сайт.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Клик средней кнопки мыши testuser Общие вопросы Javascript 4 28.06.2011 08:14
Установить меню на левый клик мыши softrix Элементы интерфейса 2 30.03.2011 09:31
Имитация нажатия кнопки мыши Mantell Общие вопросы Javascript 3 19.02.2009 16:03