• [마꾸] 19. 댓글 랜덤 이미지 소스2015.08.09 PM 04:22

게시물 주소 FONT글자 작게하기 글자 키우기


 

 

 

* 뉴리웹 *

회원 아이디가 아닌 회원 번호를 사용되게 되면서

숫자로만 댓글 이미지를 설정해주면 되게 변했습니다.

 

더 많은 랜덤 이미지를 등록하시고 싶으시다면 

회원 번호의 끝자리 두자리를 입력하셔서 (00 ~ 99)

100개의 이미지를 등록하시면 됩니다.

 

 

 

* 설명 *
댓글 랜덤이미지를 수정하기 쉽도록 소스를 작성해 보았습니다.
소스 설명을 보시고 수정하고 싶은 값들을 직접 수정해주시면 됩니다.

* 주의 *
소스를 사용하기 전에는 반드시 댓글 이미지 설정과 댓댓글 이미지 설정에 보이는
p-osition의 p와 o사이에 -를 지우고 사용하셔야 합니다.

* 추가 내용 *
이전 게시물을 참고하시면서 꾸미시면 좋을것 같습니다. 








* 소스 *



/* 댓글창 꾸미기 설정 */
.readcomment{ min-height: 35px; } /* 댓글 내용 최소 높이 */
.readcomment{ border-radius: 10px; } /* 모서리 둥글게 */
.readcomment{ background-color:#ECF1EF; }/* 댓글 내용 배경색 */
.readcomment{ margin-top: 10px; margin-bottom: 20px; margin-left: 75px; margin-right: 20px; }/* 댓글 내용 외부 간격 조절 */
.readcomment{ padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } /* 댓글 내용 내부 간격 조절 */
.mypiZmenu{padding-left: 7px;} /* 댓글 닉네임 부분 간격 조절 */

/* 댓글 이미지 설정 */
#mypiRead .mypiReply .mypiZmenu .cm01 a img{ top: 50px; left: 10px; } /* 이미지 위치 설정 */
#mypiRead .mypiReply .mypiZmenu .cm01 a img{ padding-top:50px; padding-right: 50px; }/* 이미지 크기 설정 */
#mypiRead .mypiReply .mypiZmenu .cm01 a img{ width: 0; height: 0; p-osition: absolute; } /* 기본 설정, p와 o 사이에 - 제거 */
#mypiRead .mypiReply .mypiZmenu .cm01 a img{ border-radius: 5px; }/* 모서리 둥글게 */



/* 댓댓글창 꾸미기 설정 */
.readcomment2{ min-height: 35px; } /* 댓댓글 내용 최소 높이 */
.readcomment2{ border-radius: 10px; } /* 모서리 둥글게 */
.readcomment2{ background-color:#FDF2EE; }/* 댓댓글 내용 배경색 */
.readcomment2{ margin-top: 10px; margin-bottom: 20px; margin-left: 105px; margin-right: 20px; }/* 댓댓글 내용 외부 간격 조절 */
.readcomment2{ padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } /* 댓댓글 내용 내부 간격 조절 */
.mypiZmenu2{padding-left: 20px;}/* 댓댓글 닉네임 부분 간격 조절 */

/* 댓댓글 이미지 설정 */
#mypiRead .mypiReply .mypiZmenu2 .cm01 a img{ top: 50px; left: 40px; } /* 이미지 위치 설정 */
#mypiRead .mypiReply .mypiZmenu2 .cm01 a img{ padding-top:50px; padding-right: 50px; }/* 이미지 크기 설정 */
#mypiRead .mypiReply .mypiZmenu2 .cm01 a img{ width: 0; height: 0; p-osition: absolute; } /* 기본 설정, p와 o 사이에 - 제거 */
#mypiRead .mypiReply .mypiZmenu2 .cm01 a img{ border-radius: 5px; }/* 모서리 둥글게 */



/* 테두리 기본 설정 */
.mypiZmenu{ border-top: 1px solid #ccc; }/* 댓글 상단 테두리 */
.mypiZmenu2{ border-top: 1px dashed #ddd; }/* 댓댓글 상단 테두리 */

/* 추가 배경색 */
#mypiRead .mypiReply{ background-color:#ffffff; }/* 댓글 전체 배경색*/
.mypiZmenu{ background-color:#ffffff; }/* 댓글 상단색 */
.mypiZmenu2{ background-color:#ffffff; }/* 댓댓글 상단색 */
.mypiComm{ background: #f6f6f6; }/* 댓글 작성하는 부분 외부색 */





/* 댓글 랜덤 이미지 링크 */
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="1"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="2"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="3"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="4"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="5"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="6"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="7"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="8"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="9"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu .cm01 a[href$="0"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}




/* 댓댓글 랜덤 이미지 링크 */
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="1"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="2"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="3"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="4"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="5"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="6"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="7"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="8"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="9"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}
#mypiRead .mypiReply .mypiZmenu2 .cm01 a[href$="0"] img{background-image : url(" 이미지 링크 주소 " ); background-size: cover ;}




댓글 : 44 개
이미지 링크는 일일히 전부 넣어줘야 되는건가여?
네, 이미지 링크는 전부 넣어주셔야 합니다.
음...

그럼 한가지만 더 질문드릴게여

한글로 된 닉같은 경우도 적용되나여?
이미지 적용은 마이피 주소 뒤에 보이는 ID에 의해서 적용되는거라
한글 닉네임과는 상관 없을것 같아요.
감사합니다

일단 스크랩
시간 날때 재미로 한번 해보세요.
얼른 꾸미고 싶은데 더우니 게을러지네요. ㅎㅎㅎㅎ
더위가 가시면 천천히 꾸미셔도 될것 같아요.
이미지를 하나씩 수정해서 입력하는것도 힘들것 같고요.
테스트!
테스트 감사합니다!
스크랩해두고 나중에 공부좀 해볼게요. 감사합니다
주윤발 형님님 댓글 감사합니다.
이거보고 신기해서 새벽까지 만졌습니다. 소스줍소스줍
사용하는데 불편함이 있거나 잘 이해가 안가는 부분은 말씀해주세요.
바로 수정하도록 하겠습니다.
  • K.D.Y
  • 2015/08/10 AM 09:35
테스트!
  • K.D.Y
  • 2015/08/10 AM 09:36
덧 덧
테스트 감사합니다!
친구신청도 감사합니다!
저..저도 테스트..ㅎㅎ
테스트 감사합니다 ㅋㅋㅋ
오 멋집니다 조만간 저도 이렇게 꾸며봐야겠네요 ㅎㅎ
Jr. 킴님 감사합니다. 마이피 이쁘게 꾸미세요.

그런데 아이유 진짜 이쁘네요 ㅋㅋㅋㅋ
좋은 글 잘 보고 갑니다!
사냥꿈님 감사합니다.
이미지에 제 루리웹 아바타가 나오는데 어떻게 하는거죠?
재미로 한분 한분 마다 본인의 아이디에 아바타 이미지를 넣어주고 있어요.
수작업이에요 ㅋㅋㅋㅋ
아ㅋㅋ 그랬군요 전부 다 아바타로 되어있길래 깜짝 놀랐어요 ㅎㅎ
ㅋㅋㅋㅋㅋㅋㅋ
수작업이지만, 다른 분들의 아바타를 구경할 수 있어서 좋은것 같아요.
저도 댓글 이미지 관련해서 하나 글 올리려는데 본문좀 인용해도 될까요?
네, 인용하셔도 괜찮습니다.
감사합니다! 어쩌다보니 댓글이 엄청 길어졌네요 ㅎ;;
채팅하는 기분이 나서 저는 좋아요 ㅋㅋㅋㅋㅋ
음음음?
네?
어렵다...봐도 모르겠다..
말은 그렇게 하셨지만, 이쁘게 잘 꾸미셨는데요?
너무 친절하게 설명해주셔서 한참동안 해매던걸 드디어 해결해냈습니다. 정말로 좋은 정보 감사드립니다 :)
도움되었다니 다행이에요. 마이피 이쁘게 꾸미세요!
오! 이거 보고 한번 해보겠습니다 ^ㅁ^ 감사합니다
가이린님 댓글 남겨주셔서 감사합니다!
저도 이제 마이피 시작한지 얼마안됐는데 좋은 정보 글감사합니다^^ 스크랩했다가 천천히해봐야겠네요.
빨간내복님 감사합니다 :>
좋은 자료 너무 감사합니다^_^
수호님 댓글 감사합니다 ^ㅡ^
친구글 비밀글 댓글 쓰기

user error : Error. B.