Есть скрипт смена вида материалов, все работает, но: нужно, чтобы для выводимых материалов, вид менялся не на display:block а на display:inline-block
Вид материалов модуля:
<div class="view_1 hidden">Основной вид материала</div>
<div class="view_2 hidden">Другой вид материала</div>
<div class="view_3 hidden">Третий вид материала</div>
<div class="view_4 hidden">Четвертый вид материала</div>
Видов можно создавать сколько угодно, главное добавить им два класса view_N и hidden:
<div class="pointer type_1" onclick="Views.changeView(1)">Вид первый</div>
<div class="pointer type_2" onclick="Views.changeView(2)">Вид второй</div>
<div class="pointer type_3" onclick="Views.changeView(3)">Вид третий</div>
<div class="pointer type_4" onclick="Views.changeView(4)">Вид четвертый</div>
Скрипт переключателя:
var Cookie = {
'get': function (name) {
var nameEQ = escape(name) + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) == 0) return unescape(c.substring(nameEQ.length, c.length));
}
return null;
},
'set': function (name, value, days) {
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
var expires = "; expires=" + date.toGMTString();
} else var expires = "";
document.cookie = escape(name) + "=" + escape(value) + expires + "; path=/";
}
}
var Views = {
'currentView': function () {
return Cookie.get('view-type') || 1;
},
'changeView': function (view) {
var self = this;
$('.view_' + self.currentView() + ',.view_' + view).toggle();
$('.type_' + self.currentView() + ',.type_' + view).toggle();
Cookie.set('view-type', view, 7);
},
'init': function (self) {
var self = this;
$(function () {
if (self.currentView() == 1) {
$('.type_1,.view_1').toggle();
} else {
self.changeView(self.currentView());
};
});
}
}
Views.init();
Код CSS:
<style>
.pointer { cursor: pointer }
.hidden { display: none }
</style>