주 콘텐츠로 건너뛰기

로고 이미지에 마우스 오버 시 다른 로고 이미지 노출하기

파일 업로더에 로고 파일을 업로드 한 후 디자인 편집창 > 공통 레이아웃(layout.html)과 메인 레이아웃(main.html)에서 디자인 수정 작업을 해주세요.

 

자세히 알아보기

로고에 마우스 오버 시 다른 로고 이미지 노출

로고에 마우스를 올려놓을 때와 그렇지 않을 때, 각각 다른 로고가 노출되도록 설정하고 싶은 경우 아래 내용을 참고해 주세요.

  1. 사용할 로고 이미지 2개를 준비해주세요.
  2.  [관리자] 디자인 > 웹FTP > '파일업로더' 에 접속해 '/web/upload/logo'에 준비한 로고 파일 2개를 업로드해 주세요.
  3. 스마트 디자인 편집 창에서 공통 레이아웃(layout.html)과 메인 레이아웃(main.html) 페이지의 소스를 아래와 같이 수정해 주세요. 메인 레이아웃과 공통 레이아웃 각 페이지에서 소스를 수정해야 해요.
    ▼ 아래와 같이 빨간색 소스를 삭제파란색 소스를 추가해 주세요.

    ※ logos-a.png (기본로고) / logos-b.png (마우스 오버 시 보이는 로고)

    <!--기존-->
    <a href="/index.html"><img src="{$logo}" alt="{$mall_name}" ></a>

    <!--수정 후-->
    <a href="/index.html"><img src="{$logo}" alt="{$mall_name}" onmouseover="this.src='/web/upload/logo/logos-b.png'" onmouseout="this.src='/web/upload/logo/logos-a.png'"/></a>

     

이 페이지가 도움이 되었나요?
현재 콘텐츠