JS代码冲突，三级下拉菜单与图片特效代码冲突显示异常

2014-09-12 01:06:23 189 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

Cocos Creator数据驱动下拉菜单开发：从原理到实战优化数据绑定是现代UI开发的核心概念，它通过建立数据模型与界面元素的自动同步机制，将数据变化实时映射到UI更新上。其原理在于观察者模式或响应式系统，当数据源变更时，依赖该数据的UI组件会自动重绘。这种模式的技术价值在于彻底解耦业务逻辑与视图层，极大提升了代码的可维护性和可测试性。在游戏开发、Web应用等需要动态内容展示的场景中，数据绑定是实现复杂交互界面的基石。本文聚焦于Cocos Creator引擎，深入探讨如何将数据绑定与事件驱动结合，构建一个支持动态参数传递的可交互下拉菜单组件，并涵盖对象池优化等性能实践阅读详情

图片切换正常，但是下拉菜单显示异常，第三级菜单与第二级菜单同时显示，请高手看看。

图片切换JS



function $(id) { return document.getElementById(id); }

function addLoadEvent(func){

 var oldonload = window.onload;

 if (typeof window.onload != 'function') {

  window.onload = func;

 } else {

  window.onload = function(){

   oldonload();

   func();

  }

 }

}

function moveElement(elementID,final_x,final_y,interval) {

  if (!document.getElementById) return false;

  if (!document.getElementById(elementID)) return false;

  var elem = document.getElementById(elementID);

  if (elem.movement) {

    clearTimeout(elem.movement);

  }

  if (!elem.style.left) {

    elem.style.left = "0px";

  }

  if (!elem.style.top) {

    elem.style.top = "0px";

  }

  var xpos = parseInt(elem.style.left);

  var ypos = parseInt(elem.style.top);

  if (xpos == final_x  &&  ypos == final_y) {

  return true;

  }

  if (xpos < final_x) {

    var dist = Math.ceil((final_x - xpos)/10);

    xpos = xpos + dist;

  }

  if (xpos > final_x) {

    var dist = Math.ceil((xpos - final_x)/10);

    xpos = xpos - dist;

  }

  if (ypos < final_y) {

    var dist = Math.ceil((final_y - ypos)/10);

    ypos = ypos + dist;

  }

  if (ypos > final_y) {

    var dist = Math.ceil((ypos - final_y)/10);

    ypos = ypos - dist;

  }

  elem.style.left = xpos + "px";

  elem.style.top = ypos + "px";

  var repeat = "moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";

  elem.movement = setTimeout(repeat,interval);

}

function classNormal(iFocusBtnID,iFocusTxID){

 var iFocusBtns= $(iFocusBtnID).getElementsByTagName('li');

 var iFocusTxs = $(iFocusTxID).getElementsByTagName('li');

 for(var i=0; i<iFocusBtns.length; i++) {

  iFocusBtns[i].className='normal';

  iFocusTxs[i].className='normal';

 }

}

function classCurrent(iFocusBtnID,iFocusTxID,n){

 var iFocusBtns= $(iFocusBtnID).getElementsByTagName('li');

 var iFocusTxs = $(iFocusTxID).getElementsByTagName('li');

 iFocusBtns[n].className='current';

 iFocusTxs[n].className='current';

}

function iFocusChange() {

 if(!$('ifocus')) return false;

 $('ifocus').onmouseover = function(){atuokey = true};

 $('ifocus').onmouseout = function(){atuokey = false};

 var iFocusBtns = $('ifocus_btn').getElementsByTagName('li');

 var iFocusImgs = $('ifocus_btn').getElementsByTagName('img');

 var listLength = iFocusBtns.length;

 iFocusBtns[0].onmouseover = function() {

  

  moveElement('ifocus_piclist',0,0,7);

  classNormal('ifocus_btn','ifocus_tx');

  classCurrent('ifocus_btn','ifocus_tx',0);

 }



 if (listLength>=2) {

  iFocusBtns[1].onmouseover = function() {

 

   moveElement('ifocus_piclist',0,-384,7);

   classNormal('ifocus_btn','ifocus_tx');

   classCurrent('ifocus_btn','ifocus_tx',1);

  }

 

 }

 if (listLength>=3) {

   iFocusBtns[2].onmouseover = function() {

   

    moveElement('ifocus_piclist',0,-768,7);

    classNormal('ifocus_btn','ifocus_tx');

    classCurrent('ifocus_btn','ifocus_tx',2);

  }

  

 }

 if (listLength>=4) {

   iFocusBtns[3].onmouseover = function() {

    moveElement('ifocus_piclist',0,-1152,7);

    classNormal('ifocus_btn','ifocus_tx');

    classCurrent('ifocus_btn','ifocus_tx',3);

  }

 }

  if (listLength>=5) {

   iFocusBtns[4].onmouseover = function() {

    moveElement('ifocus_piclist',0,-1536,7);

    classNormal('ifocus_btn','ifocus_tx');

    classCurrent('ifocus_btn','ifocus_tx',4);

  }

 }

  if (listLength>=6) {

   iFocusBtns[5].onmouseover = function() {

    moveElement('ifocus_piclist',0,-1920,7);

    classNormal('ifocus_btn','ifocus_tx');

    classCurrent('ifocus_btn','ifocus_tx',5);

  }

 }

 

}

setInterval('autoiFocus()',5000);

var atuokey = false;

function autoiFocus() {

 if(!$('ifocus')) return false;

 if(atuokey) return false;

 var focusBtnList = $('ifocus_btn').getElementsByTagName('li');

 var listLength = focusBtnList.length;

 for(var i=0; i<listLength; i++) {

  if (focusBtnList[i].className == 'current') var currentNum = i;

 }

 if (currentNum==0 && listLength!=1 ){

  moveElement('ifocus_piclist',0,-384,7);

  classNormal('ifocus_btn','ifocus_tx');

  classCurrent('ifocus_btn','ifocus_tx',1);

 }

 if (currentNum==1 && listLength!=2 ){

  moveElement('ifocus_piclist',0,-768,7);

  classNormal('ifocus_btn','ifocus_tx');

  classCurrent('ifocus_btn','ifocus_tx',2);

 }

 if (currentNum==2 && listLength!=3 ){

  moveElement('ifocus_piclist',0,-1152,7);

  classNormal('ifocus_btn','ifocus_tx');

  classCurrent('ifocus_btn','ifocus_tx',3);

 }

  if (currentNum==3 && listLength!=4 ){

  moveElement('ifocus_piclist',0,-1536,7);

  classNormal('ifocus_btn','ifocus_tx');

  classCurrent('ifocus_btn','ifocus_tx',4);

 }

  if (currentNum==4 && listLength!=5 ){

  moveElement('ifocus_piclist',0,-1920,7);

  classNormal('ifocus_btn','ifocus_tx');

  classCurrent('ifocus_btn','ifocus_tx',5);

 }

 if (currentNum==5 ){

  moveElement('ifocus_piclist',0,0,7);

  classNormal('ifocus_btn','ifocus_tx');

  classCurrent('ifocus_btn','ifocus_tx',0);

 }

 

 

}

addLoadEvent(iFocusChange);

...全文

WPS启动卡顿终极优化：从图形加速到系统配置的全面解决方案在软件性能优化领域，图形渲染与硬件加速是提升应用流畅度的核心技术。其原理在于通过GPU分担图形计算任务，解放CPU资源，从而显著改善界面响应速度。对于基于Qt框架开发的办公软件，如WPS Office，合理配置OpenGL或DirectX后端是实现硬件加速的关键。这项技术的核心价值在于解决因驱动兼容性或渲染设置不当导致的界面卡顿、滚动迟滞等问题，广泛应用于需要复杂图形界面的桌面软件。本文聚焦WPS启动与运行卡顿的典型场景，深入剖析了通过环境变量调优（如设置QT_OPENGL=angle）、清理插件缓存（如a 阅读详情

makoshen

JavaScript 87,983 成员 224,681 内容

+ 关注 + 加入社区

切换为时间正序

makoshen 2014-09-12

打赏
举报

图片特效JS冲突的代码已经排比出来了


function $(id) { return document.getElementById(id); }
function addLoadEvent(func){
 var oldonload = window.onload;
 if (typeof window.onload != 'function') {
  window.onload = func;
 } else {
  window.onload = function(){
   oldonload();
   func();
  }
 }
}

怎么修改啊？

makoshen 2014-09-12

打赏
举报

请高手帮忙看看啊急死了

makoshen 2014-09-12

打赏
举报

下拉菜单JS


/* index */


function sidemenu(id){
	var $obj = $(id), sideMenuIndex = -1;
	$obj.children("li").each(function(i){
		if(window.location.href.indexOf($(this).children("a").attr("href")) > -1){
			sideMenuIndex = i;
			if($(this).find("li").size() > 0){
				$(this).addClass("withsub");
			}
			$(this).children("a").eq(0).addClass("on");
			$(this).children("ul").show();
		}
	});
	$obj.find("li:has(li) li").each(function(i){
		if(window.location.href.indexOf($(this).children("a").attr("href")) > -1){
			sideMenuIndex = i;
			$(this).addClass("hover");
			$(this).parent().parent().addClass("withsub").children("a").eq(0).addClass("on");
			$(this).parent("ul").show();
		}
	});
	
}

(function (b) {
    b.fn.superfish = function (k) {
        var g = b.fn.superfish,
            j = g.c,
            f = b(['<span class="', j.arrowClass, '"> »</span>'].join("")),
            i = function () {
                var c = b(this),
                    l = d(c);
                clearTimeout(l.sfTimer);
                c.showSuperfishUl().siblings().hideSuperfishUl()
            },
            e = function () {
                var c = b(this),
                    m = d(c),
                    l = g.op;
                clearTimeout(m.sfTimer);
                m.sfTimer = setTimeout(function () {
                        l.retainPath = (b.inArray(c[0], l.$path) > -1);
                        c.hideSuperfishUl();
                        if (l.$path.length && c.parents(["li.", l.hoverClass].join("")).length < 1) {
                            i.call(l.$path)
                        }
                    }, l.delay)
            },
            d = function (c) {
                var l = c.parents(["ul.", j.menuClass, ":first"].join(""))[0];
                g.op = g.o[l.serial];
                return l
            },
            h = function (c) {
                c.addClass(j.anchorClass).append(f.clone())
            };
        return this.each(function () {
                var c = this.serial = g.o.length;
                var m = b.extend({}, g.defaults, k);
                m.$path = b("li." + m.pathClass, this).slice(0, m.pathLevels).each(function () {
                    b(this).addClass([m.hoverClass, j.bcClass].join(" ")).filter("li:has(ul)").removeClass(m.pathClass)
                });
                g.o[c] = g.op = m;
                b("li:has(ul)", this)[(b.fn.hoverIntent && !m.disableHI) ? "hoverIntent" : "hover"](i, e).each(function () {
                    if (m.autoArrows) {
                        h(b(">a:first-child", this))
                    }
                }).not("." + j.bcClass).hideSuperfishUl();
                var l = b("a", this);
                l.each(function (n) {
                    var o = l.eq(n).parents("li");
                    l.eq(n).focus(function () {
                        i.call(o)
                    }).blur(function () {
                        e.call(o)
                    })
                });
                m.onInit.call(this)
            }).each(function () {
                var c = [j.menuClass];
                if (g.op.dropShadows && !(b.browser.msie && b.browser.version < 7)) {
                    c.push(j.shadowClass)
                }
                b(this).addClass(c.join(" "))
            })
    };
    var a = b.fn.superfish;
    a.o = [];
    a.op = {};
    a.IE7fix = function () {
        var c = a.op;
        if (b.browser.msie && b.browser.version > 6 && c.dropShadows && c.animation.opacity != undefined) {
            this.toggleClass(a.c.shadowClass + "-off")
        }
    };
    a.c = {
        bcClass: "sf-breadcrumb",
        menuClass: "sf-js-enabled",
        anchorClass: "sf-with-ul",
        arrowClass: "sf-sub-indicator",
        shadowClass: "sf-shadow"
    };
    a.defaults = {
        hoverClass: "sfHover",
        pathClass: "overideThisToUse",
        pathLevels: 1,
        delay: 800,
        animation: {
            opacity: "show"
        },
        speed: "normal",
        autoArrows: true,
        dropShadows: true,
        disableHI: false,
        onInit: function () {},
        onBeforeShow: function () {},
        onShow: function () {},
        onHide: function () {}
    };
    b.fn.extend({
        hideSuperfishUl: function () {
            var e = a.op,
                d = (e.retainPath === true) ? e.$path : "";
            e.retainPath = false;
            var c = b(["li.", e.hoverClass].join(""), this).add(this).not(d).removeClass(e.hoverClass).find(">ul").hide().css("visibility", "hidden");
            e.onHide.call(c);
            return this
        },
        showSuperfishUl: function () {
            var e = a.op,
                d = a.c.shadowClass + "-off",
                c = this.addClass(e.hoverClass).find(">ul:hidden").css("visibility", "visible");
            a.IE7fix.call(c);
            e.onBeforeShow.call(c);
            c.animate(e.animation, e.speed, function () {
                    a.IE7fix.call(c);
                    e.onShow.call(c)
                });
            return this
        }
    })
})(jQuery);
//导航3级栏目下拉
    $(document).ready(function() { 
    $("#nav").superfish({ 
    delay:       500,                             
    animation:   {opacity:'show',height:'show'},  
    speed:       'fast',                          
    autoArrows:  false,                           
    dropShadows: false                           
    }); 
    });
$(function(){
	$("#nav ul.third").each(function(){
		var hasthird = $(this).find("li").size();
		if(hasthird==0)
		{
			$(this).addClass("thirdNone");
		}						   
	})	
})

请高手帮忙

JS代码冲突，三级下拉菜单与图片特效代码冲突 显示异常

相关推荐

JS代码冲突，三级下拉菜单与图片特效代码冲突显示异常