我正在尝试确定滑块的拖动方向,我该如何实现?我需要它,因为我正在同步2个滑块,所以我需要更改同步滑块,只要另一个滑块。到目前为止,只要您使用按钮进行导航,它就会起作用,如下所示:
$('.owl-next').click(function() {
sync2.trigger('next.owl.carousel');
})
$('.owl-prev').click(function() {
sync2.trigger('prev.owl.carousel');
})
这些事件都在sync1滑块上,所以每当你走一条或另一条路时,它也会以同样的方式移动sync2。我只需要在用户拖动滑块进行更改时执行此操作。我可以听到拖动的事件,但我无法确定它是左转还是右转?
在owl carousel 1中有一个dragDirection属性,但似乎已经消失了。
答案 0 :(得分:3)
以下是我的解决方案,似乎可以正常使用以下代码 -
$('.owl-carousel').owlCarousel({
loop:true,
margin:10,
nav:true,
responsive:{
0:{
items:1
},
600:{
items:3
},
1000:{
items:5
}
}
}).on("dragged.owl.carousel", function (event) {
console.log('event : ',event.relatedTarget['_drag']['direction'])
});
答案 1 :(得分:0)
这是我使用% Begin initialization code - DO NOT EDIT
gui_Singleton = 1;
gui_State = struct('gui_Name', mfilename, ...
'gui_Singleton', gui_Singleton, ...
'gui_OpeningFcn', @skripsi_OpeningFcn, ...
'gui_OutputFcn', @skripsi_OutputFcn, ...
'gui_LayoutFcn', [] , ...
'gui_Callback', []);
if nargin && ischar(varargin{1})
gui_State.gui_Callback = str2func(varargin{1});
end
if nargout
[varargout{1:nargout}] = gui_mainfcn(gui_State, varargin{:});
else
gui_mainfcn(gui_State, varargin{:});
end
% End initialization code - DO NOT EDIT
% --- Executes just before skripsi is made visible.
function skripsi_OpeningFcn(hObject, eventdata, handles, varargin)
% This function has no output args, see OutputFcn.
% hObject handle to figure
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
% varargin command line arguments to skripsi (see VARARGIN)
% Choose default command line output for skripsi
handles.output = hObject;
% Update handles structure
guidata(hObject, handles);
% UIWAIT makes skripsi wait for user response (see UIRESUME)
% uiwait(handles.figure1);
conmysql = database('skripsi_mysql','root','')
fetch(conmysql,'select * from data')
% --- Outputs from this function are returned to the command line.
function varargout = skripsi_OutputFcn(hObject, eventdata, handles)
% varargout cell array for returning output args (see VARARGOUT);
% hObject handle to figure
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
% Get default command line output from handles structure
varargout{1} = handles.output;
function code_Callback(hObject, eventdata, handles)
% hObject handle to code (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
% Hints: get(hObject,'String') returns contents of code as text
% str2double(get(hObject,'String')) returns contents of code as a double
code = get(hObject,'String')
handles.code = code
guidata(hObject,handles)
% --- Executes during object creation, after setting all properties.
function code_CreateFcn(hObject, eventdata, handles)
% hObject handle to code (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles empty - handles not created until after all CreateFcns called
% Hint: edit controls usually have a white background on Windows.
% See ISPC and COMPUTER.
if ispc && isequal(get(hObject,'BackgroundColor'), get(0,'defaultUicontrolBackgroundColor'))
set(hObject,'BackgroundColor','white');
end
function in_Callback(hObject, eventdata, handles)
% hObject handle to in (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
% Hints: get(hObject,'String') returns contents of in as text
% str2double(get(hObject,'String')) returns contents of in as a double
in = get(hObject,'String')
handles.in = in
guidata(hObject,handles)
% --- Executes during object creation, after setting all properties.
function in_CreateFcn(hObject, eventdata, handles)
% hObject handle to in (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles empty - handles not created until after all CreateFcns called
% Hint: edit controls usually have a white background on Windows.
% See ISPC and COMPUTER.
if ispc && isequal(get(hObject,'BackgroundColor'), get(0,'defaultUicontrolBackgroundColor'))
set(hObject,'BackgroundColor','white');
end
function out_Callback(hObject, eventdata, handles)
% hObject handle to out (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
% Hints: get(hObject,'String') returns contents of out as text
% str2double(get(hObject,'String')) returns contents of out as a double
out = get(hObject,'String')
handles.out = out
guidata(hObject,handles)
% --- Executes during object creation, after setting all properties.
function out_CreateFcn(hObject, eventdata, handles)
% hObject handle to out (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles empty - handles not created until after all CreateFcns called
% Hint: edit controls usually have a white background on Windows.
% See ISPC and COMPUTER.
if ispc && isequal(get(hObject,'BackgroundColor'), get(0,'defaultUicontrolBackgroundColor'))
set(hObject,'BackgroundColor','white');
end
function fee_Callback(hObject, eventdata, handles)
% hObject handle to fee (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
% Hints: get(hObject,'String') returns contents of fee as text
% str2double(get(hObject,'String')) returns contents of fee as a double
fee = str2double(get(hObject,'String'))
handles.fee = fee
guidata(hObject,handles)
% --- Executes during object creation, after setting all properties.
function fee_CreateFcn(hObject, eventdata, handles)
% hObject handle to fee (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles empty - handles not created until after all CreateFcns called
% Hint: edit controls usually have a white background on Windows.
% See ISPC and COMPUTER.
if ispc && isequal(get(hObject,'BackgroundColor'), get(0,'defaultUicontrolBackgroundColor'))
set(hObject,'BackgroundColor','white');
end
% --- Executes on button press in masuk.
function masuk_Callback(hObject, eventdata, handles)
% hObject handle to masuk (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
a = 'QWERTY';
t = datestr(datenum(now),'HH:MM');
conmysql = database('skripsi_mysql','root','')
field = {'Code','In','Out','Fee'}
databaru = {a,t,'',}
insert(conmysql,'data',field,databaru)
data = fetch(conmysql,'select * from data')
% --- Executes on button press in camera.
function camera_Callback(hObject, eventdata, handles)
% hObject handle to camera (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
% --- Executes on button press in keluar.
function keluar_Callback(hObject, eventdata, handles)
% hObject handle to keluar (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
conmysql = database('skripsi_mysql','root','')
sql = ['select * from data where PlatNomor =','''',handles.code,''''];
fetch(conmysql,'select *from data');
data = fetch(conmysql,sql)
data.In
t1 = datestr(datenum(now),'HH:MM');
t2 = datenum(t1);
t3 = datenum(data.in);
time_diff = t3 - t2;
hours = ceil(time_diff * 24)
fee = hours * 5;
field = {'JamKeluar','Biaya'};
databaru = {t1,2000};
tablename = 'data';
whereclause = ['where PlatNomor =','''',handles.code,''''];
update(conmysql,tablename,field,databaru,whereclause);
set(handles.in,'String',data.in)
set(handles.out,'String',data.out)
set(handles.fee,'String',data.fee)
获取方向的解决方案。
border-collapse: collapse;
请注意,我的轮播使用相同的relatedTarget.state
类。
答案 2 :(得分:0)
这也可以通过比较猫头鹰载物台元素X位置的起始值和当前值来实现:
var owl = $(".owl-carousel").owlCarousel({
items: 1,
loop: true,
autoplay: true
});
owl.on("change.owl.carousel", function (e) {
if (e.relatedTarget._drag["stage"]["start"].x < e.relatedTarget._drag["stage"]["current"].x) {
console.log("move right");
} else {
console.log("move left");
}
});
答案 3 :(得分:0)
我必须使用猫头鹰传送带-owl1和owl2。当owl1发生问题时-owl2必须做同样的事情。 解决方案是:
owl1.on("change.owl.carousel", function(event){
setTimeout(function(){
if (event.relatedTarget['_drag']['direction'] == "right") {
owl2.trigger('prev.owl.carousel');
event.relatedTarget['_drag']['direction'] = null;
} else {
owl2.trigger('next.owl.carousel');
}
}, 0);
});
在setTimeout函数中检查event.relatedTarget ['_ drag'] ['direction']很重要,因为change.owl.carousel事件会在event.relatedTarget ['_ drag'] ['direction']更改之前触发